npm install @bdsoft/element组件库参考
pnpm install @bdsoft/element
`
2. 注册 在main.js中添加引用
`main.js
import { useElement } from '@bdsoft/element'
app.use(useElement)
`
老项目更新问题
由于element-plus剥离独立版本,以后项目中不再需要安装element-plus、及图标库@element-plus/icons-vue
1. 删除项目main.js中的引入element-plus及@element-plus/icons-vue(包含样式)
2. 在main.js中添加引入@bdsoft/element 参考上面2步骤
圆点组件
`
import { BdBadge } from '@bdsoft/element';
默认提示点
警告提示点
错误提示点
动态提示点
动态提示点
`
搜索框组件
`
import logoImg from '/logo.png'
// 重新搜索
const handleSearch = (title, isfirst) => {
let _title = title.value
console.info('重新搜索', title, isfirst)
}
`
全局方法的调用
`方法1
import { getCurrentInstance } from "vue";
const { appContext: { config: { globalProperties } } } = getCurrentInstance()
globalProperties.showsuccess()
`
`方法2
import { showwarning } from '@bdsoft/element'
`
Bar 组件使用
`
import { BdBar } from '@bdsoft/element'
`
splitpanes 组件使用
`
{{ paneSize }}%
{{ 100 - paneSize }}%
`
重大变更
* 1.1.21(20260114)之后写法变了,将element-plus的引用放到项目中去进行注入
`
前置处理:先拉取最新代码然后
1. pnpm uninstall @bdsoft/element
2. pnpm install @bdsoft/element@1.1.23
3. pnpm install element-plus@2.13.1
4. main.js 处理
import { useElement } from '@bdsoft/element'
// 1. 导入 Element Plus 核心和样式
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css' // 全局引入样式,组件包无需再导入
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
app.use(useElement,{ElementPlus: ElementPlus ,zhCn:zhCn})
``