qq252750818-优快云博客

原创 vue2与vue3中的v-model语法糖

在vue2中通过上面的代码，我们可以分析得出，也就是说： v-model="str" 是 :value="str" @input="str = $event.target.value" 的缩写$event 指代当前触发的事件对象。$event.target 指代当前触发的事件对象的dom$event.target.value 就是当前dom的value值在@input方法中，value => str在:value中：str => value如此，形成了一个闭环，也就是所说的数据的双向绑定。现在咱

2022-06-30 20:12:19 1194

原创 vue3中vuex与pinia初识

众所周知的是vue2.x中状态管理工具用的是vuex，而vue3中也是可以使用vuex的，且用vue cli 创建的vue3项目里面也是可选vuex是否安装的，或者项目初始化时不安装，如果有需要再进行安装使用 npm包管理工具是这样的：而用yarn的话是这样的：下载完依赖包之后就需要创建vuex首先是从main.js中引入并挂载然后在src文件夹下创建store文件并创建index.js，并且在index.js中创建一个vuex当然如果你要是用vue cli 直接创建就可以省略以上步骤，vue3

2022-06-13 12:27:01 1469

原创 vue3.0中的axios二次封装

vue项目中用的是aixos来进行请求，但是项目中接口请求比较多，而且vue3.0也不像vue2.x一样在入口文件引入后直接挂载到全局，比如这样：这是vue2.x的挂载全局的写法，很方便。但是vue3.0中不支持直接挂载到全局，且vue3.0中更习惯在哪里使用在哪里引入，比如这样：这样虽然方便一些，但是随着代码越来越多，接口也越来越多，使用起来还是很不方便的，而且也不方便管理，这时候就需要我们根据个人需求进行二次封装1.首先可以在src目录下创建一个文件夹，用于放置文件我个人习惯是先建一个用于放

2022-06-01 22:01:34 3746

原创 vue2生命周期和vue3生命周期的区别

vue2常用生命周期：创建前：beforeCreate() 只有一些实例本身的事件和生命周期函数创建后：Created() 是最早使用data和methods中数据的钩子函数挂载前：beforeMount() 指令已经解析完毕，内存中已经生成dom树挂载后：Mounted() dom渲染完毕页面和内存的数据已经同步更新前：beforeUptate() 当data的数据发生改变会执行这个钩子，内存中的数据是新的，页面是旧的更新后：Updated() 内存和页面都是新的销毁前：bef

2022-05-12 21:55:06 6514

原创 vue2.x及vue3.0 使用elementUI中的Cascader 级联选择器，点击立即关闭功能

在vue2.x版本中如果使用级联选择器想要点击任意一级立即关闭的话需要用refs获取当前实例并找到他的一个属性为：this.$refs.cascaderRef._self.dropDownVisible = false同时把elementui里面的checkStrictly属性设置为true 这个用的比较少，因为点击任意一级立即关闭用的地方比较少，$refs后面是你自己级联选择器上面绑定的ref在vue3.0版本中没有dropDownVisible这个属性，他的意思是下拉可见只要点击时把设置

2022-05-10 16:57:11 2068 4

原创 v-for和v-if 优先级的问题

注意：永远不要把 v-if 和 v-for 同时用在同一个元素上，带来性能方面的浪费（每次渲染都会先循环再进行条件判断）不能这样写，会出现警告 <div v-for="(item,index) in checkList" :key="index" v-if="item.status"> </div> 正确的写法<template v-for="(item,index) in checkList"> <div :key="in

2022-05-09 19:33:19 119

原创浅谈v-html 解析时 img图片渲染超出边界的问题

一般来说content作为后端返回的富文本xx.content = content.replace(/\<img/gi, '<img style="max-width:100%;height:auto" ')这里xx是指你赋值之后的变量名可直接在请求后写比如：axios.get('').then(res=>{ data=res.data data.content=data.content.replace(/\<img/gi, '<img

2022-04-22 20:45:41 1604

qq252750818的博客