- 代码示例 <div id="app"> <p>$route.name: {{$route.name}}</p> <p>$route.path: {{$route.path}}</p> <p>$route.query: {{$route.query}}</p> </di... 代码示例 <div id="app"> <p>$route.name: {{$route.name}}</p> <p>$route.path: {{$route.path}}</p> <p>$route.query: {{$route.query}}</p> </di...
- 代码示例 <div id="app"> <child @buttonclick="buttonClick" :title="title">插槽会显示这段内容</child> </div> <script src="./vue.js"></script> <script> // ... 代码示例 <div id="app"> <child @buttonclick="buttonClick" :title="title">插槽会显示这段内容</child> </div> <script src="./vue.js"></script> <script> // ...
- this.$router默认是当前窗口打开 代码示例 let routeData = this.$router.resolve({ path: '/home', query: { id: 1 } }); window.open(routeData.href, '_blank'); 12 参考 vue中$router.push打开新窗口 this.$router默认是当前窗口打开 代码示例 let routeData = this.$router.resolve({ path: '/home', query: { id: 1 } }); window.open(routeData.href, '_blank'); 12 参考 vue中$router.push打开新窗口
- Webpack中有一个函数 require.context(directory, useSubdirectories = false, regExp = /^\.\//) 1 参数: directory:要搜索的文件夹目录useSubdirectories:是否还应该搜索它的子目录regExp:一个匹配文件的正则表达式 自动注册Vue组件(适用于高频组件) /... Webpack中有一个函数 require.context(directory, useSubdirectories = false, regExp = /^\.\//) 1 参数: directory:要搜索的文件夹目录useSubdirectories:是否还应该搜索它的子目录regExp:一个匹配文件的正则表达式 自动注册Vue组件(适用于高频组件) /...
- Vue.directive文档: https://cn.vuejs.org/v2/guide/custom-directive.html 使用 定义一个按钮级别指令 // 获取用户角色, 可以从cookie中获取 function getRole() { return 'admin' } // 校验用户权限,传入一个数组 function hasPermi... Vue.directive文档: https://cn.vuejs.org/v2/guide/custom-directive.html 使用 定义一个按钮级别指令 // 获取用户角色, 可以从cookie中获取 function getRole() { return 'admin' } // 校验用户权限,传入一个数组 function hasPermi...
- 所谓隔代通信就是A 与C的通信 A -> B -> C 1 代码实例 A.vue <template> <div id="app"> <!-- 此处监听了事件,可以在C组件中直接触发 --> <b-child nameToB="nameToB" nameToC="nameToC" @buttonClick... 所谓隔代通信就是A 与C的通信 A -> B -> C 1 代码实例 A.vue <template> <div id="app"> <!-- 此处监听了事件,可以在C组件中直接触发 --> <b-child nameToB="nameToB" nameToC="nameToC" @buttonClick...
- el-dialog 参数 destroy-on-close,可以刷新里边的子元素 如果套用el-form,需要换成v-if="visible", 关闭对话框就销毁,打开对话框就重建表单,可以触发表单的created事件 参考 element destroy-on-close属性使用踩坑 el-dialog 参数 destroy-on-close,可以刷新里边的子元素 如果套用el-form,需要换成v-if="visible", 关闭对话框就销毁,打开对话框就重建表单,可以触发表单的created事件 参考 element destroy-on-close属性使用踩坑
- 测试环境 利用脚手架生成一个vue项目,需要选择 vue-router # 安装 Vue Cli cnpm install -g @vue/cli $ vue --version 3.12.0 # 创建一个项目 vue create vue-demo 12345678 一、预渲染 1、安装插件 cnpm install prerender-spa-plug... 测试环境 利用脚手架生成一个vue项目,需要选择 vue-router # 安装 Vue Cli cnpm install -g @vue/cli $ vue --version 3.12.0 # 创建一个项目 vue create vue-demo 12345678 一、预渲染 1、安装插件 cnpm install prerender-spa-plug...
- NPM CDN : https://www.jsdelivr.com/ 一、发布一个Vue组件 1、使用webpack-simple 模板项目初始化 vue init webpack-simple moment-ui cd moment-ui cnpm i 12345 2、新建组件 将新建的组件放在plugin文件夹中 src/plugin/Button... NPM CDN : https://www.jsdelivr.com/ 一、发布一个Vue组件 1、使用webpack-simple 模板项目初始化 vue init webpack-simple moment-ui cd moment-ui cnpm i 12345 2、新建组件 将新建的组件放在plugin文件夹中 src/plugin/Button...
- 1、安装 # 安装 Vue Cli npm install -g @vue/cli # 创建一个项目 vue create hello-world # 安装vant npm i vant -S # 完整写法:npm install vant --save # 安装插件 npm i babel-plugin-import -D # 完整写法: npm inst... 1、安装 # 安装 Vue Cli npm install -g @vue/cli # 创建一个项目 vue create hello-world # 安装vant npm i vant -S # 完整写法:npm install vant --save # 安装插件 npm i babel-plugin-import -D # 完整写法: npm inst...
- 开发环境: vue-cli-service serve //默认:process.env.NODE_ENV=development 1 .evn.development ENV = 'development' VUE_APP_BASE_URL = 'https://development.demo.com' 12 生产环境: vue-cli-service ... 开发环境: vue-cli-service serve //默认:process.env.NODE_ENV=development 1 .evn.development ENV = 'development' VUE_APP_BASE_URL = 'https://development.demo.com' 12 生产环境: vue-cli-service ...
- 1、router-link <router-link :to='url' target='_blank></router-link> 1 2、$router let router = this.$router.resolve( { path: <yourPath>, query: { 'ticket': '123456' }... 1、router-link <router-link :to='url' target='_blank></router-link> 1 2、$router let router = this.$router.resolve( { path: <yourPath>, query: { 'ticket': '123456' }...
- 需求: 多级分类支持多选选择子节点需要把父节点的值也选中,用于筛选时选中父节点也能筛出子节点分类可以无限级添加子节点 开发 这个需求使用ElementUI, Cascader 级联选择器 文档: https://element.eleme.cn/#/zh-CN/component/cascader 参数设置 // 筛选项 options:[ { valu... 需求: 多级分类支持多选选择子节点需要把父节点的值也选中,用于筛选时选中父节点也能筛出子节点分类可以无限级添加子节点 开发 这个需求使用ElementUI, Cascader 级联选择器 文档: https://element.eleme.cn/#/zh-CN/component/cascader 参数设置 // 筛选项 options:[ { valu...
- 几个实用的 Vue 自定义指令 复制粘贴指令 v-copy 长按指令 v-longpress 输入框防抖指令 v-debounce 禁止表情及特殊字符 v-emoji 图片懒加载 v-LazyLoad 权限校验指令 v-premission 实现页面水印 v-waterMarker 拖拽指令 v-draggable 代码地址: https://github.com/... 几个实用的 Vue 自定义指令 复制粘贴指令 v-copy 长按指令 v-longpress 输入框防抖指令 v-debounce 禁止表情及特殊字符 v-emoji 图片懒加载 v-LazyLoad 权限校验指令 v-premission 实现页面水印 v-waterMarker 拖拽指令 v-draggable 代码地址: https://github.com/...
- 模板地址:https://github.com/mouday/vue-cdn-template 包含的库 Vue.js https://cn.vuejs.org/v2/guide/installation.html Element https://element.eleme.cn/#/zh-CN/component/installation momentjs ... 模板地址:https://github.com/mouday/vue-cdn-template 包含的库 Vue.js https://cn.vuejs.org/v2/guide/installation.html Element https://element.eleme.cn/#/zh-CN/component/installation momentjs ...
上滑加载中
推荐直播
-
用码道,让你的AI作品三步上朋友圈2026/08/04 周二 19:00-20:00
林华鼎-华为云AI开发者运营负责人
从入门 · 到做AI应用 · 到企业级开发。不教编程,只教用AI · 零代码、有产出、能带走、可炫耀 · 每课人人动手实操
回顾中 -
华为云码道Agent集成与鸿蒙实战2026/08/11 周二 19:00-21:00
王一男-华为云码道产品规划专家;李炎-华为云码道产品专家;彭江敏-华为云鸿蒙端云一体化开发专家
本次直播带你解读华为云码道7月份产品新特性、新功能。更有专家演示码道Agent Space × 钉钉机器集成实战,从0到1打通消息通道;码道鸿蒙端云一体化实战,快速搭建员工签到系统。
回顾中 -
基于华为云码道,构建你的定制化AI搭子2026/08/14 周五 09:00-11:30
明亮-华为云开发者发展与支持部部长
本期直播将向您全面介绍华为云码道产品,并基于码道手把手教你部署自己的定制化AI陪伴搭子。
回顾中
热门标签