- 在前期博文《Vue进阶(幺贰柒):Vue插槽》中主要讲解了Vue中插槽的基础用法,此篇博文接下来讲解高版本下通过v-slot指令如何应用Vue插槽及与slot、slot-scope的用法区别。 demo 不具名插槽 <body> <div id="app"> <Test> <div>slot插槽占位内容</di... 在前期博文《Vue进阶(幺贰柒):Vue插槽》中主要讲解了Vue中插槽的基础用法,此篇博文接下来讲解高版本下通过v-slot指令如何应用Vue插槽及与slot、slot-scope的用法区别。 demo 不具名插槽 <body> <div id="app"> <Test> <div>slot插槽占位内容</di...
- 在前期博文《Vue进阶(六十四):iframe在更改了src之后对应的网页并未刷新》,讲解了解决iframe下src变化后,页面内容未刷新问题,解决方法是在更改iframe src属性值之前加上document.getElementById(iframe的id).contentWindow.location.reload(true);处理逻辑,但是在后续项目开发过程中发... 在前期博文《Vue进阶(六十四):iframe在更改了src之后对应的网页并未刷新》,讲解了解决iframe下src变化后,页面内容未刷新问题,解决方法是在更改iframe src属性值之前加上document.getElementById(iframe的id).contentWindow.location.reload(true);处理逻辑,但是在后续项目开发过程中发...
- 什么是iframe? iframe 元素会创建包含另外一个文档的内联框架(即行内框架)。 什么是postMessage? window.postMessage() 方法可以安全地实现跨源通信。通常,对于两个不同页面的脚本,只有当执行它们的页面位于具有相同的协议(通常为https),端口号(443为https的默认值),以及主机 (两个页面的模数 Document.... 什么是iframe? iframe 元素会创建包含另外一个文档的内联框架(即行内框架)。 什么是postMessage? window.postMessage() 方法可以安全地实现跨源通信。通常,对于两个不同页面的脚本,只有当执行它们的页面位于具有相同的协议(通常为https),端口号(443为https的默认值),以及主机 (两个页面的模数 Document....
- 项目开发过程中,需要实现操作栏位图标按钮与文字按钮切换效果,在实现文字按钮过程中,大致思路如下:操作栏位只展示前2个菜单,之后的菜单采用更多方式展示,通过点击更多展示其余菜单按钮。 实现代码如下: <template slot-scope="scope"> <el-dropdown :split-button="false" trigger="click" type... 项目开发过程中,需要实现操作栏位图标按钮与文字按钮切换效果,在实现文字按钮过程中,大致思路如下:操作栏位只展示前2个菜单,之后的菜单采用更多方式展示,通过点击更多展示其余菜单按钮。 实现代码如下: <template slot-scope="scope"> <el-dropdown :split-button="false" trigger="click" type...
- Vue.js为两个最为常用的指令提供了特别的缩写: v-bind缩写 <!--完整语法--> <a v-bind:href="url">测试</a> <!--缩写--> <a :href="url">测试</a> 1234 v-on缩写 <!--完整语法--> <a v-o... Vue.js为两个最为常用的指令提供了特别的缩写: v-bind缩写 <!--完整语法--> <a v-bind:href="url">测试</a> <!--缩写--> <a :href="url">测试</a> 1234 v-on缩写 <!--完整语法--> <a v-o...
- 场景 有时候我们会看到如下代码: 在我们使用vue进行开发的过程中,可能会遇到一种情况:当生成vue实例后,当再次给对象赋值时,有时候并不会自动更新到视图上去; 当我们去看vue文档的时候,会发现有这么一句话:如果在实例创建之后添加新的属性到实例上,它不会触发视图更新。 如下代码,给 student对象新增 age 属性。 data () { return {... 场景 有时候我们会看到如下代码: 在我们使用vue进行开发的过程中,可能会遇到一种情况:当生成vue实例后,当再次给对象赋值时,有时候并不会自动更新到视图上去; 当我们去看vue文档的时候,会发现有这么一句话:如果在实例创建之后添加新的属性到实例上,它不会触发视图更新。 如下代码,给 student对象新增 age 属性。 data () { return {...
- 前言 俗话说,没有产品思维的码农不是一个好的程序猿。前端项目开发一段时间之后,除了必要的业务功能必须实现之外,就要开始考虑给开发系统增加一些附加价值,提升用户体验可以说是最大的附加价值。当然,从一开始开发项目就将客户体验置于优先考虑点是最好的选择。 1 尽量使用单列而不是多列布局 单列布局能够让对全局有更好的掌控。同时用户也可以一目了然内容。而多列则会有分散用户注... 前言 俗话说,没有产品思维的码农不是一个好的程序猿。前端项目开发一段时间之后,除了必要的业务功能必须实现之外,就要开始考虑给开发系统增加一些附加价值,提升用户体验可以说是最大的附加价值。当然,从一开始开发项目就将客户体验置于优先考虑点是最好的选择。 1 尽量使用单列而不是多列布局 单列布局能够让对全局有更好的掌控。同时用户也可以一目了然内容。而多列则会有分散用户注...
- 实例 在控制台上输出信息: console.info("Hello Runoob!"); 1 定义和用法 console.info() 方法用于在控制台输出信息。 该方法对于开发过程进行测试很有帮助。 提示: 在测试该方法的过程中,控制台需要可见 (浏览器按下 F12 打开控制台)。 语法 console.info(message) 浏览器支持 表格中的数字... 实例 在控制台上输出信息: console.info("Hello Runoob!"); 1 定义和用法 console.info() 方法用于在控制台输出信息。 该方法对于开发过程进行测试很有帮助。 提示: 在测试该方法的过程中,控制台需要可见 (浏览器按下 F12 打开控制台)。 语法 console.info(message) 浏览器支持 表格中的数字...
- 组件之间的数据传递自定义组件ES6 Promise 用法VUE输入框事件监听blur与change的差异Vuex之理解Mutations与 Vuex 的第一次接触vue中created、mounted等方法整理vue store存储commit 和dispatchVue项目中的单元测试和E2E测试vue项目开发前的es6的知识储备【ES6】var、let、const三者... 组件之间的数据传递自定义组件ES6 Promise 用法VUE输入框事件监听blur与change的差异Vuex之理解Mutations与 Vuex 的第一次接触vue中created、mounted等方法整理vue store存储commit 和dispatchVue项目中的单元测试和E2E测试vue项目开发前的es6的知识储备【ES6】var、let、const三者...
- 精解ES6 Promise 用法 复杂的概念先不讲,我们先简单粗暴地把Promise用一下,有个直观感受。那么第一个问题来了,Promise是什么东东呢?是一个类?对象?数组?函数?别猜了,直接打印出来看看吧,console.dir(Promise),就这么简单粗暴。 这么一看就明白了,Promise是一个构造函数,自己身上有all、reject、resolve这几... 精解ES6 Promise 用法 复杂的概念先不讲,我们先简单粗暴地把Promise用一下,有个直观感受。那么第一个问题来了,Promise是什么东东呢?是一个类?对象?数组?函数?别猜了,直接打印出来看看吧,console.dir(Promise),就这么简单粗暴。 这么一看就明白了,Promise是一个构造函数,自己身上有all、reject、resolve这几...
- 1、动态路由(页面刷新数据不丢失) methods:{ insurance(id) { //直接调用$router.push 实现携带参数的跳转 this.$router.push({ path: `/particulars/${id}`, }) } 1234567 路由配置 { path: '/particulars/:id', name: 'particu... 1、动态路由(页面刷新数据不丢失) methods:{ insurance(id) { //直接调用$router.push 实现携带参数的跳转 this.$router.push({ path: `/particulars/${id}`, }) } 1234567 路由配置 { path: '/particulars/:id', name: 'particu...
- 首先解释下base64的目的,其主要是为了减少http请求,转为base64以后小图片可以跟js同时被加载到浏览器,而不需要多次对服务器发出图片资源请求;其次,图片转成base64后,文件体积变大了大约1/3左右。 文件的base64编码存储到了js文件中。vue-webpack模板的默认设置限制了转码的文件大小为10000B以下。静态文件目录中的所有文件不会被转码,... 首先解释下base64的目的,其主要是为了减少http请求,转为base64以后小图片可以跟js同时被加载到浏览器,而不需要多次对服务器发出图片资源请求;其次,图片转成base64后,文件体积变大了大约1/3左右。 文件的base64编码存储到了js文件中。vue-webpack模板的默认设置限制了转码的文件大小为10000B以下。静态文件目录中的所有文件不会被转码,...
- Ctrl+n 找classCtrl+shift+n 找文件Ctrl+Shift+F,全局查找Alt+f7 查看引用Ctrl+ Alt+f7 弹小窗口查看引用Ctrl+F7,可以查询当前元素在当前文件中的引用,然后按 F3 可以选择F11 自己配置,深入查看F12 自己配置,直接查看实现类Ctrl+f12 查看类中方法Ctrl+U,转到父类Ctrl+G,定位行Ctrl+o... Ctrl+n 找classCtrl+shift+n 找文件Ctrl+Shift+F,全局查找Alt+f7 查看引用Ctrl+ Alt+f7 弹小窗口查看引用Ctrl+F7,可以查询当前元素在当前文件中的引用,然后按 F3 可以选择F11 自己配置,深入查看F12 自己配置,直接查看实现类Ctrl+f12 查看类中方法Ctrl+U,转到父类Ctrl+G,定位行Ctrl+o...
- package-lock.json的作用是锁定安装时的包的版本号,并且需要上传到git,以保证其他人在npm install时大家的依赖能保证一致。 根据官方文档,这个package-lock.json 是在 npm install时候生成一份文件,用以记录当前状态下实际安装的各个npm package的具体来源和版本号。 它有什么作用呢?因为npm是一个用于管理p... package-lock.json的作用是锁定安装时的包的版本号,并且需要上传到git,以保证其他人在npm install时大家的依赖能保证一致。 根据官方文档,这个package-lock.json 是在 npm install时候生成一份文件,用以记录当前状态下实际安装的各个npm package的具体来源和版本号。 它有什么作用呢?因为npm是一个用于管理p...
- 前言 Vue 原本有一个官方推荐的 ajax 插件 vue-resource,但是自从 Vue 更新到 2.0 之后,官方就不再更新 vue-resource。 目前主流的 Vue 项目,都选择 axios来完成 ajax 请求,而大型项目都会使用 Vuex 来管理数据,所以这篇博客将结合两者来发送请求。 Vuex 的安装将不再赘述,可以参考... 前言 Vue 原本有一个官方推荐的 ajax 插件 vue-resource,但是自从 Vue 更新到 2.0 之后,官方就不再更新 vue-resource。 目前主流的 Vue 项目,都选择 axios来完成 ajax 请求,而大型项目都会使用 Vuex 来管理数据,所以这篇博客将结合两者来发送请求。 Vuex 的安装将不再赘述,可以参考...
上滑加载中
推荐直播
-
华为云码道Skill实战与极速交付,智能开发全链路实战2026/07/22 周三 19:00-21:00
王一男-华为云码道产品规划专家;李炎-华为云码道产品专家;姜浩-华为云HCDG核心组成员
直播深度解读华为云码道6月产品新特性,从Skill市场安装专家技能,带你零距离体验从需求,开发,审查,重构全链路闭环的开发过程。从零构建并交付一个完整项目,让您体验从代码提交到服务上线的“极速”之旅。
回顾中 -
聚开发者之力,创具身新未来2026/07/23 周四 15:00-17:00
张豪杰/程文/王军/刘新春/黄钦开 /张晓天
本次华为云具身智能开发平台CloudRobo培训面向具身智能开发者,带您全流程体验机器人本体R2C小时级接入、环境重建与轨迹生成仿真数据生产、PB级数据管理、数据评测、模型训推、强化学习和Benchmark一键评测等功能,并体验业界主流具身模型应用。
回顾中
热门标签