支持vue2版本,当用vue3安装element-ui软件系统定制开发的时候会报错,这就需要安装element-plus版本来用到vue3项目中。
element-ui网址:
element-plus网址:
1、首先安装element-plus
npm install element-plus --save
可以在package.json中检查是否安装成功
出现这一行就证明安装成功了...
2、修改main.js或main.ts文件
- import { createApp } from "vue";
- import App from "./App.vue";
- import router from "./router";
- import store from "./store";
- import ElementPlus from 'element-plus';
- import 'element-plus/theme-chalk/index.css';
-
- import locale from 'element-plus/lib/locale/lang/zh-cn'
- createApp(App).use(store).use(router).use(scroll).use(ElementPlus, { locale }).mount("#app");
-
3、然后在代码中使用
- <template>
- <div class="Select">
- <el-select v-model="value" filterable placeholder="请选择">
- <el-option
- v-for="item in options"
- :key="item.value"
- :label="item.label"
- :value="item.value"
- />
- </el-select>
- </div>
- </template>
- <script lang="ts">
- import { defineComponent, ref } from "vue";
-
- export default defineComponent({
- name: "Select",
- props: {},
- setup() {
- const value = ref("");
- const options = [
- {
- value: "上海市",
- label: "上海市",
- },
- {
- value: "杭州市",
- label: "杭州市",
- },
- {
- value: "北京市",
- label: "北京市",
- },
- {
- value: "天津市",
- label: "天津市",
- },
- {
- value: "重庆市",
- label: "重庆市",
- },
- ];
- return {
- value,
- options,
- };
- },
- });
- </script>
然后应该就可以了...
4、有的会出现报错,那就再安装一下element ui
- npm install element-ui -S