随笔分类 - vue随笔
摘要：Vue3 组件通信方式 props $emit expose / ref $attrs v-model provide / inject Vuex mitt Vue3 通信使用写法 1. props 用 props 传数据给子组件有两种方法，如下 方法一，混合写法 // Parent.vue 传送
阅读全文
摘要：vue提供install可供我们开发新的插件及全局注册组件等install方法第一个参数是vue的构造器，第二个参数是可选的选项对象 export default { install(Vue,option){ 组件 指令 混入 挂载vue原型 } } 全局注册组件 import PageTools
阅读全文
摘要：npm WARN read-shrinkwrap This version of npm is compatible with lockfileVersion@1, but package-lock.json was generated for lockfileVersion@2. I’ll try
阅读全文
摘要：emits 官方文档传送门 Vue官方建议我们在组件中所有的emit事件都能在组件的emits选项中声明 emits参数有俩种形式对象和数组，对象里面可以配置带校验emit事件，为null的时候代表不校验，校验的时候，会把emit事件的参数传到校验函数的参数里面 当校验函数不通过的时候，控制台会输出
阅读全文
摘要：开源的vue知识图谱展示组件：relation-graph 这个项目使用典型的vue编程方式，代码简单易懂。用这个关系图谱组件可以非常方便的展示如组织机构图谱、股权架构图谱、集团关系图谱等知识图谱，可提供多种图谱布局，包括树状布局、中心布局、力学布局自动布局等。用起来简单方便，通过组件自身提供的配置
阅读全文
摘要：如上图，这是一个vue页面中的table，在其columns中加了一个selection后，实现了多选/全选table行的功能： { type: 'selection', width: 60, align: 'center' }, 现需要对这个table中select勾选框的勾选和显示进行diy:
阅读全文
摘要：首先在main.ts中挂在全局方法 // 挂载resize方法 Vue.prototype.$echartsResize = function (ref:any) { window.addEventListener("resize",function(){ ref.resize() }) } 然后在
阅读全文
摘要：前言随着vue3在2022 年 2 月 7 日被提升为新的默认版本，这也将成为一个新的潮流，我们前端开发者也将在未来的工作中更多的使用vue3来搭建以及开发我们的项目。因此了解vue3和vue2的区别也就成为了一件至关重要的事情了。 概览一、新特性1、组合式API setup 2、ref创建响应式数
阅读全文
摘要：我们做后台分页后，删除最后一页最后一条数据时出现页码没有返回上一页造成序号问题，序号从最后一页开始计算 解决问题思路：判断被删除的数据是否为最后一页的最后一条数据、如果是则让页码减一，如果不是则在当前面即可 如向计算？？如下所示： 参数如下 proTempList: { pageNo: 1, //页
阅读全文
摘要：首先来看看遇到的问题 在对话框中修改数据，页面中也会随着对话框中数据的修改而修改 再来看看代码中的赋值 这样只是浅拷贝了row对象的地址给vipDataDialog，也就是说两个对象指向的是同一个存储空间，无论哪个对象发生改变，其实都是改变的存储空间的内容，因此，两个对象是联动的 我们只需要进行深拷
阅读全文
摘要：环境是Vue2+TS，话不多说上代码。 效果图： 首先是视图部分 <Input @on-change="(value) => handleChange(value, 'occupyNotionalAmount')" :maxlength="21" v-model.number="newForm1.o
阅读全文
摘要：今天笔者在学习vue3的时候顺带巩固了下vue的基础，感觉这些还是挺有用的，特此分享给大家。 once，只执行一次 <div v-on:click.once='alert("1")'></div> 2. prevent阻止默认程序，比如form表单中的summit提交按钮，会自己提交， <form
阅读全文
摘要：// 公共方法 let _utils = { /** * 对一段指定的字符串应用 HTML 编码。 * @paramhtml * @returns{*} */ encodeHtml: html => { if (typeof (html) == 'string') { return html.rep
阅读全文
摘要：最近笔者项目比较忙，没怎么更新博客，今天来更新一下项目中所用的一个展示pdf的功能。 一、安装 npm install --save vue-pdf 二、基本示例 <template> <div class="pdf"> <pdf ref="pdf" :src="pdfUrl"> </pdf> </
阅读全文
摘要：今天记录一下这个问题，在用vue写前端，在页面取值的时候，发现控制台一直报错 控制台报错信息： 错误信息：属性或方法“peoples”不是在实例上定义的，而是在渲染过程中被引用的。 通过初始化属性，确保此属性是反应性的，无论是在数据选项中，还是对于基于类的组件。 所以，由此我们就知道了，在vue的t
阅读全文
摘要：1. 变更的语法 1. $on 移除 vue3 默认不支持eventBus模式 2. filter 语法 vue3直接移除 {{msg}} methods替换 3. .sync 基于prop双向绑定 v-model 2. 对比选项式组合式API区别 1. 选项式功能的实现时分割的不在一起的 组合式功
阅读全文
摘要：vue3.0正式版本已经发布超过一年,社区生态已经完善,所以,是时候开始使用vue3.0了 目前已支持 vue3 的UI组件库 ant-design-vuehttps://antdv.com/docs/vue/introduce-cn/ant-design-vue 是 Ant Design 的 Vu
阅读全文
摘要：Lazy-Load，翻译过来是“懒加载”。它是针对图片加载时机的优化：在一些图片量比较大的网站（比如电商网站首页，或者团购网站、小游戏首页等），如果我们尝试在用户打开页面的时候，就把所有的图片资源加载完毕，那么很可能会造成白屏、卡顿等现象，因为图片真的太多了，一口气处理这么多任务，浏览器做不到啊！
阅读全文
摘要：在项目中，有时候检测一个变量的值是否反升了变化。通常使用的watch或者使用低效的循环判断。 在次vue中给我们设置了深度监测数据繁盛变化的方法。 1.vue中提供了在watch监听时设置deep:true 就可以实现对对象的深度监听; 2.immediate:true,代表watch里面声明了之
阅读全文
摘要：热爱vue开发的同学肯定知道awesome-vue 这个github地址，里面包含了数以千计的vue开源插件，而这些插件大都来自第三方开发者们，是他们为vue社区提供了大量的技术支持和解决方案。本文立足vue开源的理念，主要为vue开发者讲解编写vue插件的方法和步骤，通过理论与实践相结合的方式来加
阅读全文
浙公网安备 33010602011771号