vue3
saturday-yh
Object.create(null)
展开
-
快速上手vue3
快速上手vue3原创 2024-04-23 11:09:20 · 845 阅读 · 0 评论 -
element plus语言默认为英语,修改为中文
<template> <div> <el-config-provider :locale="zhCn"> <router-view v-slot="{ Component }"> <!-- keep-alive 缓存 --> <keep-alive include="addTemp,simpleTemp"> <component :is="Compone.原创 2022-04-13 14:19:10 · 612 阅读 · 0 评论 -
vue3+vite+ts+elementPlus+sass 项目搭建
兼容性注意Vite 需要 Node.js 版本 >= 12.0.0。npm init vite@latest初始化的vue3项目 没有router axios vuex sass等插件根据自己需求安装依赖包npm i axios @antv/g2 element-plus lodash print-js qf-export-excel qs vue-router vuex vuex-persistedstate -Snpm i sass -D需要说一点就是.原创 2022-04-12 14:10:19 · 1663 阅读 · 0 评论 -
vue3语法糖<script setup>,父子组件通信 使用defineEmit,defineProps,defineExpose
注意:这些语法糖是建立在<script setup>上的以封装element-plus Pagination 分页组件子组件获取到父组件的值用defineEmit,子组件给父组件传值用defineProps子组件暴露自己的数据和方法用defineExpose直接上完整代码子组件:<template> <el-pagination @size-change="handleSizeChange" @current-change="原创 2022-04-12 13:54:14 · 2143 阅读 · 0 评论 -
vue3+vite <script setup > 配置name属性
// 首先安装插件npm i vite-plugin-vue-setup-extend -D// vite.config.ts 引入import vueSetupExtend from 'vite-plugin-vue-setup-extend'export default { plugins: [vue(), vueSetupExtend()],}//vue组件<script setup lang="ts" name="simpleTemp"> 直接使用..原创 2022-04-11 18:01:00 · 2088 阅读 · 0 评论 -
vue Component inside <Transition> renders non-element root node that cannot be animated.
警告:没有用根节点,无法使用动画在router-view上 使用div标签包住,<div> <router-view v-slot="{ Component }"> <!-- keep-alive 缓存 --> <keep-alive include="addTemp,simpleTemp"> <component :is="Component" /> </keep-...原创 2022-04-08 16:07:32 · 1021 阅读 · 0 评论 -
vue3 子父传值emit
方法一://子组件setup(props,context) { toParent() { context.emit('msg',111) }}父组件<child @msg="childmsg"></child>childmsg(e){ console.log(ee)}方法二://子组件import { getCurrentInstance,} from "vue";setup(props) {原创 2022-04-07 09:14:14 · 631 阅读 · 0 评论 -
vue3 定义全局方法(获取全局this)
在main.ts(main.js)中添加const app = createApp(App)app.config.globalProperties.$http = () => { alert(1111)}在组件中使用import { defineComponent, reactive, ref,getCurrentInstance } from 'vue'const _this:any = getCurrentInstance()console.log(_this.ap.原创 2021-09-28 15:13:36 · 3838 阅读 · 0 评论 -
vuecli 的全局安装和卸载
vuecli2的安装查看所有版本号npm view vue-cli versions --json //指定版本安装 npm install -g vue-cli@2.x.x //安装vue-cli2最新版 npm install -g vue-cli vue-cli2版本的卸载npm uninstall -g vue-cli获取vue-cli3.x.x 版本npm view @vue/cli versions --json//指定版本安装原创 2021-09-18 14:57:44 · 1425 阅读 · 0 评论 -
vue3的环境搭建及项目初始化
首先按照我写的更新脚手架vuecli 的全局安装和卸载_前端的路上-CSDN博客在进行安装脚手架包的时候会报错1. 用管理员权限开启从cmd创建项目 – 这个方法我成功了。 2.按照网上的解决方法修改C盘用户文件夹下的 .vuerc文件。 修改内容 “useTaobaoRegistry”: false, 原来值为true。 3. 更新 vue脚手架的版本。方法一:方法二:...原创 2021-09-18 15:30:07 · 171 阅读 · 0 评论