- 最近遇到了一个问题，就是 Vue.js 中的 prop 如何实现双向绑定比较好。 之前我都是把 prop 传递到子组件，然后子组件里面直接把 prop 直接改了，这样虽然能把结果反映到父组件，但并不是一个很好的解决方案。 比如我就经常遇到这样的 Warning： Avoid mutating a prop directly since the value wi... 最近遇到了一个问题，就是 Vue.js 中的 prop 如何实现双向绑定比较好。 之前我都是把 prop 传递到子组件，然后子组件里面直接把 prop 直接改了，这样虽然能把结果反映到父组件，但并不是一个很好的解决方案。 比如我就经常遇到这样的 Warning： Avoid mutating a prop directly since the value wi...
- 以windows 系统为例，操作方法如下： 一、修改默认浏览器 设置谷歌浏览器为默认浏览器。 1、首先打开“开始菜单”，点击“控制面板”； 2、在“控制面板”里面找到“默认程序”，进入后点击“设置默认程序”； 3、加载好后选择 “谷歌浏览器”； 4、选择“将此程序设置为默认值”，如果安装360安全卫士，必须先退出360安全卫士，否则设置不起效果。 5、选择... 以windows 系统为例，操作方法如下： 一、修改默认浏览器 设置谷歌浏览器为默认浏览器。 1、首先打开“开始菜单”，点击“控制面板”； 2、在“控制面板”里面找到“默认程序”，进入后点击“设置默认程序”； 3、加载好后选择 “谷歌浏览器”； 4、选择“将此程序设置为默认值”，如果安装360安全卫士，必须先退出360安全卫士，否则设置不起效果。 5、选择...
- 在博文《Vue进阶（九十一）：自定义指令》中讲解了Vue自定义指令（局部、全局）的创建方法，及指令相关的钩子函数。此篇博文在此基础上实现vue自定义拖动指令。 1. 定义全局拖拽指令： 定义全局指令，需要在main.js中写入vue.directive('drag',{});即可。但是一般会现在项目新建一个drag.js文件，在js文件内部实现拖拽逻辑，最后在dom... 在博文《Vue进阶（九十一）：自定义指令》中讲解了Vue自定义指令（局部、全局）的创建方法，及指令相关的钩子函数。此篇博文在此基础上实现vue自定义拖动指令。 1. 定义全局拖拽指令： 定义全局指令，需要在main.js中写入vue.directive('drag',{});即可。但是一般会现在项目新建一个drag.js文件，在js文件内部实现拖拽逻辑，最后在dom...
- this指向组件的实例，$el用于获取Vue实例挂载的DOM元素，在mounted生命周期中才有效，之前的钩子函数内无效。如下代码所示，Vue脚手架中，$el指向当前组件template模板中的根标签。 <template> <div id="root"> <h1 @click="fn()"> Lorem, ipsum </h1> </div> </templ... this指向组件的实例，$el用于获取Vue实例挂载的DOM元素，在mounted生命周期中才有效，之前的钩子函数内无效。如下代码所示，Vue脚手架中，$el指向当前组件template模板中的根标签。 <template> <div id="root"> <h1 @click="fn()"> Lorem, ipsum </h1> </div> </templ...
- 在前期博文《Vue进阶（幺陆肆）：vue自定义拖动指令》讲解了Vue如何自定义拖拽指令，以上方法只是简单实现了元素的基本拖拽，在视图可视化编辑功能中，不仅需要对页面元素进行拖拽，而且还需要实现页面元素可编辑。 在开源项目（esview）基础上已经实现了页面元素属性可编辑，开源项目（vue-drag-resize）基础上实现了页面元素可拖拽功能，现需要对以上2个开源项目... 在前期博文《Vue进阶（幺陆肆）：vue自定义拖动指令》讲解了Vue如何自定义拖拽指令，以上方法只是简单实现了元素的基本拖拽，在视图可视化编辑功能中，不仅需要对页面元素进行拖拽，而且还需要实现页面元素可编辑。 在开源项目（esview）基础上已经实现了页面元素属性可编辑，开源项目（vue-drag-resize）基础上实现了页面元素可拖拽功能，现需要对以上2个开源项目...
- Render 函数是 Vue2.x 新增的一个函数、主要用来提升节点的性能，它是基于 JavaScript 计算。使用 Render 函数将 Template 里面的节点解析成虚拟的 Dom 。 Vue 推荐在绝大多数情况下使用模板来创建你的 HTML。然而在一些场景中，你需要 JavaScript 的完全编程能力。这时你可以用渲染函数render，它比模板更接... Render 函数是 Vue2.x 新增的一个函数、主要用来提升节点的性能，它是基于 JavaScript 计算。使用 Render 函数将 Template 里面的节点解析成虚拟的 Dom 。 Vue 推荐在绝大多数情况下使用模板来创建你的 HTML。然而在一些场景中，你需要 JavaScript 的完全编程能力。这时你可以用渲染函数render，它比模板更接...
- 在应用Vue进行项目开发过程中，应用this.$refs[name].resetFields();实现表单搜索元素重置时发现失效。经检查发现是form-item绑定的属性prop与包裹元素el-input绑定值不一致造成的。现梳理有关应用this.$refs[name].resetFields();重置表单方法的注意事项。 Form必须要有ref属性Form必须绑定：... 在应用Vue进行项目开发过程中，应用this.$refs[name].resetFields();实现表单搜索元素重置时发现失效。经检查发现是form-item绑定的属性prop与包裹元素el-input绑定值不一致造成的。现梳理有关应用this.$refs[name].resetFields();重置表单方法的注意事项。 Form必须要有ref属性Form必须绑定：...
- Vue+iVIew项目开发过程中，需要实现页面根据html格式的字符串，在页面中解析的效果。 例如 let htmlStr='<div style="font-size=16px">我是小标题</div>' 页面中显示效果如下： 我是小标题 主要是在render()函数中实现,示例代码如下： { title: "标题", ke... Vue+iVIew项目开发过程中，需要实现页面根据html格式的字符串，在页面中解析的效果。 例如 let htmlStr='<div style="font-size=16px">我是小标题</div>' 页面中显示效果如下： 我是小标题 主要是在render()函数中实现,示例代码如下： { title: "标题", ke...
- “window.location.href”、"location.href"是本页面跳转. “parent.location.href” 是上一层页面跳转. “top.location.href” 是最外层的页面跳转. 举例说明： 如果A,B,C,D都是html，D是C的iframe，C是B的iframe，B是A的iframe，如果D中js这样写 "windo... “window.location.href”、"location.href"是本页面跳转. “parent.location.href” 是上一层页面跳转. “top.location.href” 是最外层的页面跳转. 举例说明： 如果A,B,C,D都是html，D是C的iframe，C是B的iframe，B是A的iframe，如果D中js这样写 "windo...
- 绝对路径：是从盘符开始的路径，形如 C:\windows\system32\cmd.exe 所谓的绝对路径就是完整的路径。 相对路径：是从当前路径开始的路径，假如当前路径为C:\windows 要描述上述路径，只需输入 system32\cmd.exe 实际上，严格的相对路径写法应为 .\system32\cmd.exe 其中，.表示当前路径，在通道情况下可以省略，只有... 绝对路径：是从盘符开始的路径，形如 C:\windows\system32\cmd.exe 所谓的绝对路径就是完整的路径。 相对路径：是从当前路径开始的路径，假如当前路径为C:\windows 要描述上述路径，只需输入 system32\cmd.exe 实际上，严格的相对路径写法应为 .\system32\cmd.exe 其中，.表示当前路径，在通道情况下可以省略，只有...
- vue项目启动后调用顺序: index.html → main.js → app.vue → index.js → components/组件 一般项目创建好后会有三个文件：index.html、main.js、app.vue index.html ：所有vue文件都是单页面形式开发，所有vue组件都是通过index.html进行渲染加载。main.js：相当于ja... vue项目启动后调用顺序: index.html → main.js → app.vue → index.js → components/组件 一般项目创建好后会有三个文件：index.html、main.js、app.vue index.html ：所有vue文件都是单页面形式开发，所有vue组件都是通过index.html进行渲染加载。main.js：相当于ja...
- 在Vue项目中，使用ElementUI显示表格数据时，如果某一个列数值长度超过列宽，会默认换行，造成显示不友好。 翻阅Element-UI文档，可发现show-overflow-tooltip列属性可实现列内容过长被隐藏时显示tooltip的功能。 注：show-overflow-tooltip属性需要谨慎使用，如果一个页面多列使用，会影响页面加载速度。因为show... 在Vue项目中，使用ElementUI显示表格数据时，如果某一个列数值长度超过列宽，会默认换行，造成显示不友好。 翻阅Element-UI文档，可发现show-overflow-tooltip列属性可实现列内容过长被隐藏时显示tooltip的功能。 注：show-overflow-tooltip属性需要谨慎使用，如果一个页面多列使用，会影响页面加载速度。因为show...
- Vue进阶（幺贰叁）：v-for实现一行展示n个元素 需求背景 在开发前端项目过程中，遇到结果列表操作栏位需要每2个按钮元素为一行展示需求。 需求分析 可通过将返回值封装为二维数组，或者根据数组下标进行换行操作。 解决方案 经过实践，发现将返回值数组封装为二维数组，然后前端通过el-row,el-col标签封装实现。实现代码如下： <el-row v... Vue进阶（幺贰叁）：v-for实现一行展示n个元素 需求背景 在开发前端项目过程中，遇到结果列表操作栏位需要每2个按钮元素为一行展示需求。 需求分析 可通过将返回值封装为二维数组，或者根据数组下标进行换行操作。 解决方案 经过实践，发现将返回值数组封装为二维数组，然后前端通过el-row,el-col标签封装实现。实现代码如下： <el-row v...
- 应用场景 在做vue项目时，发现路由跳转之后，页面默认停留在当前浏览的位置，但是很多时候我们想要的是路由跳转之后，页面重新定位到顶部，下面介绍一下可以实现的方法。 方式一 在main.js 中添加代码： router.afterEach((to, from, next) => { window.scrollTo(0, 0) }) 123 方式二 如... 应用场景 在做vue项目时，发现路由跳转之后，页面默认停留在当前浏览的位置，但是很多时候我们想要的是路由跳转之后，页面重新定位到顶部，下面介绍一下可以实现的方法。 方式一 在main.js 中添加代码： router.afterEach((to, from, next) => { window.scrollTo(0, 0) }) 123 方式二 如...
- 在前端应用中，窗口间的通信用的地方还是挺多的，比如弹出qq登录认证窗。 postMessage语法 window.postMessage(msg,targetOrigin) 1 注意postMessage要通过window对象调用！因为这里的window不只是当前window，大部分使用postMessage的时候，都不是本页面的window，而是其他网页的win... 在前端应用中，窗口间的通信用的地方还是挺多的，比如弹出qq登录认证窗。 postMessage语法 window.postMessage(msg,targetOrigin) 1 注意postMessage要通过window对象调用！因为这里的window不只是当前window，大部分使用postMessage的时候，都不是本页面的window，而是其他网页的win...
上滑加载中
推荐直播
-
华为云码道 × 仓颉编程：工程化AI编码探索2026/05/27 周三 19:00-21:00
刘俊杰-华为云仓颉语言专家/李炎-华为云码道技术专家/王智鹏-OpenCangjie开源社区发起人
本场直播围绕华为云仓颉语言与华为云码道的深度结合，展示华为云智能编程从零基础到高效落地的完整生态能力。以华为云码道为引擎，仓颉语言为载体，带给大家日常提效、趣味创新到极速量产的开发体验。
回顾中
热门标签