- parent.vue 定义了1个方法和2个数据 <template> <div class=""> 这是父组件 {{message}} </div> </template> <script> export default { name: 'Parent', data() { return { m... parent.vue 定义了1个方法和2个数据 <template> <div class=""> 这是父组件 {{message}} </div> </template> <script> export default { name: 'Parent', data() { return { m...
- 笔记参考 https://zh.nuxtjs.org/ 服务器端渲染 利于 SEO客户端渲染 vue-server-renderer https://ssr.vuejs.org/zh/guide/ 安装环境 npm install vue vue-server-renderer --save 1 1、渲染示例 const Vue = require("vu... 笔记参考 https://zh.nuxtjs.org/ 服务器端渲染 利于 SEO客户端渲染 vue-server-renderer https://ssr.vuejs.org/zh/guide/ 安装环境 npm install vue vue-server-renderer --save 1 1、渲染示例 const Vue = require("vu...
- 刷新页面 方法一 window.reload()； 12 方法二 this.$router.go(0); 1 以上两种方式会出现白屏 方法三 不会有闪烁的空白出现 App.vue <template> <div id="app"> <!-- 增加判断，让其隐藏 --> <router-view v-if="... 刷新页面 方法一 window.reload()； 12 方法二 this.$router.go(0); 1 以上两种方式会出现白屏 方法三 不会有闪烁的空白出现 App.vue <template> <div id="app"> <!-- 增加判断，让其隐藏 --> <router-view v-if="...
- <template> <div id="app"> <input type="file" @change="handleChange" /> <audio controls="true" @loadeddata="handleLoad" :src="url"> </audio> </div> &l... <template> <div id="app"> <input type="file" @change="handleChange" /> <audio controls="true" @loadeddata="handleLoad" :src="url"> </audio> </div> &l...
- 代码示例 <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 ...
上滑加载中
推荐直播
-
华为云码道Skill实战与极速交付，智能开发全链路实战2026/07/22 周三 19:00-21:00
王一男-华为云码道产品规划专家；李炎-华为云码道产品专家；姜浩-华为云HCDG核心组成员
直播深度解读华为云码道6月产品新特性，从Skill市场安装专家技能，带你零距离体验从需求，开发，审查，重构全链路闭环的开发过程。从零构建并交付一个完整项目，让您体验从代码提交到服务上线的“极速”之旅。
回顾中 -
聚开发者之力，创具身新未来2026/07/23 周四 15:00-17:00
张豪杰/程文/王军/刘新春/黄钦开 /张晓天
本次华为云具身智能开发平台CloudRobo培训面向具身智能开发者，带您全流程体验机器人本体R2C小时级接入、环境重建与轨迹生成仿真数据生产、PB级数据管理、数据评测、模型训推、强化学习和Benchmark一键评测等功能，并体验业界主流具身模型应用。
回顾中
热门标签