04 2024 档案
摘要：v-pre,是将元素内的内容全部渲染出来 最常见的就是显示双大括号标签及内容 上面的代码输出为: 直接将元素的内的内容直接渲染出来 v-once是用来将元素的值只进行一次变化，仅渲染元素和组件一次，并跳过之后的更新 上述代码中，当经过了两秒输出为： <div v-once>这个元素的值的渲染并没有变
阅读全文
摘要：v-model的修饰符 .number的作用是将绑定的值从string类型变为number类型 在上述代码中，我们在input元素绑定了blur事件，作用为当鼠标移出当元素，触发该事件去响应方案 可以看到在鼠标移出后，控制台打印的number类型为string 当我们再v-model后加上修饰符.n
阅读全文
摘要：v-model的作用实现元素或组件上的双向绑定 v-model指令只能用于： 在input元素上使用v-model绑定，实际就是给元素的value属性赋值 在input元素和select元素使用v-model 在上述代码中，input元素和select元素都使用v-model绑定了同一个值， 页面为
阅读全文
摘要：class，style是各种dom元素的都具有的原生属性 class与:class的区别，直接使用class的话，后面跟的是常量，若使用:class,v-bind:class的话，后面需跟变量，可以实现动态地改变元素的样式 如下图代码： 在上述代码中，在button元素中，对class原生属性赋值了
阅读全文
摘要：在vue进行循环的数组或者对象中，使用了v-for进行dom元素的渲染。 当数组或对象中的值发生变化时，可能会使dom元素重新渲染。是否会重新渲染和我们设置的key属性对应的值有关 合理的设置key属性的值可以有效的提高页面的的更新效率 首先，vue使用了diff算法来进行dom元素的更新， dif
阅读全文
摘要：v-bind是为html元素绑定属性 缩写: html的元素可以有原生属性和自定义属性，每个dom元素的原生属性可以自己上网查找 v-bind的三个修饰符的作用: 在下面的代码中，使用了ref声明了dom元素的名称，id为该div元素的原生属性，data是使用了v-bind简写的方式，在divDom
阅读全文
摘要：v-on的作用为绑定一个事件 v-on可以 缩写：@ v-on可以与点击(click)，鼠标移出(mouseout)等事件进行绑定，只要是JS的方法都可以进行定义 在v-on指令中，还可以添加修饰符 以上修饰符都可以在进行事件绑定时进行修饰 其中，.prevent修饰符，可以阻止页面的跳转，阻止默认
阅读全文
摘要：v-for v-for可以用来循环数组，对象，字符串，number等，一般用来循环数组和对象 v-for写在哪个元素中，就会循环哪个元素 上图中，使用v-for来挂载在div上，用于循环div元素，上图中写了循环数组和循环对象的写法，对于对象的循环主要是对其的key，value进行循环,循环对象的属
阅读全文
摘要：v-show可以写在dom标签中，可以根据表达式的true还是false来判断是否显示该标签的内容 v-show是通过css属性的display来控制是否显示的，不删除元素 v-show： 在所写的代码中 按住f12选择样式，display被划掉了，元素被显示了 当display勾选的时候，元素不显
阅读全文
摘要：在vue3中需要引入ref和reactive函数对变量进行声明 首先引入ref，reactive函数，vue3不同于vue2的是，变量的声明需要写在setup函数中，(vue2是直接写在data函数中) 其中ref主要是对一些基础数据变量声明，如string，number，boolean， 而rea
阅读全文
摘要：在控制台输入vue create 文件名(vue3_basis) 选择第三个，默认自行选择安装 选择Router和vuex 选择3.x -> vue3 全部的选择项如下图 全部选择完后，开始构建项目
阅读全文
