- 博客(10)
- 收藏
- 关注
RSS订阅原创 路由导航守卫日常
afterEach），路由守卫写在main.js文件，或者写在router文件夹下的index.js文件，比如说，当点击商城的购物车的时候，需要判断一下是否登录，如果没有登录，就跳转到登录页面，如果登陆了，就跳转到。路由导航守卫：进入路由之前的回调函数，（加上判断）可以控制是否可以进入这个路由，做一个路由拦截和跳转页面。全局路由导航守卫，三个参数，to去哪里，from从哪来，next跳转。分为，全局路由导航守卫，组件内导航守卫，独享导航守卫。又分为前置路由导航守卫，后置路由导航守卫。
2023-04-25 21:44:59
101
原创 watch与computed
computed : 对多个变量或者对象进行处理后返回一个结果值，也就是多个变量中的某一个值发生了变化，则我们监控的这个值也就会发生变化。当需要监听一个对象的改变时，普通的watch方法无法监听到对象内部属性的改变，此时就需要deep属性对对象进行深度监听。计算属性是基于他们的依赖进行缓存的， 多用于处理多个变量返回一个值。deep:true, // 深度监听，可以监听对象的属性的变化。watch是用来响应data中的数据的变化，一般用于异步或者开销较大的操作。
2023-04-19 20:04:32
81
原创 组件通信的部分方法
首先建立2个组件A与B 再建立一个新的vue对象并导出，再建立一个父组件，把AB两个组件引入父组件，并且A与B分别引入vue.js。第二种的有点在于，能多一个类型的判断，并且有一个默认值，在父组件没给子组件传值的时候，可以显示子组件的默认值。把子组件引入父组件，可以直接传递，子组件用props接取父组件传的值。（1）在父组件中子组件的标签上，使用：属性名=属性值（传递的值）在父组件的fn函数中接取子组件传出的值。在父组件中使用子组件传过去的注册事件，B组件接受A组件的值。
2023-04-19 19:54:40
61
原创 $nextTick
如上图在数组中，push进一个新的数字，由于代码是从上而下的执行，所以会增加一个li并且会增加ul的高度，但这个时候在控制台打印的效果。而$nextTick的作用就和定时器类似，给第二个log做一个延迟，等待dom更新完成后才回调函数，从而获取最新的dom，两次的log数值是相同的，是因为vue数据变化后更新dom是异步的也就是会有延迟，所以两次的值是相同的，定义：在下次DOM更新结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM。这样log出来的值就是更新之后的dom。
2023-04-19 19:11:12
63
原创 key的作用
vue在渲染数据时会复用dom元素，key的作用就是防止dom元素被复用而产生不必要的bug，如果复用的元素有input这类的值，那么如果没有key的话，值可能会重复。如果代码内加key，并且key的值为唯一，
2023-04-19 18:58:50
48
原创 路由配置二 路由传参的部分方法
（1）首先把需要跳转的两个组件挂载在index.js中的routes，需要跳转的页面为goods和info。（1）在goods界面添加ul li 正常循环数组，并且给li加点击事件，并且在函数名后传入实参。（1）第一种方法类似，但需要更改：to后的拼接方式，并且在index.js 挂在组件后+/：id。this.$router.push固定不变，path（路径），query（查询）属性名:属性值。（2）添加点击事件函数并且在函数后传入形参，汉译就是这个把这个地址拉进这个路由。方法二： 编程式跳转。
2023-04-13 23:57:53
221
原创 路由配置的日常
router link to 会把元素默认更改为a标签，tag：更改为li标签，to后面代表路径 ，active-class为路由自带，后边跟随active是给此元素增加css样式，下方 router-view 代表视口，必须包裹在div内。（1）在vue2中创建router文件夹，在文件夹内创建index.js，再把index.js引入vue2框架中的main.js中。（3）在vue2 src中创建相应的文件夹，并且在创建的文件夹内创建相应的App.vue，再在相应的vue中创建视口。
2023-04-12 21:33:53
70
原创 少量Vue指令日常
3.v-if与v-show的相同与不同，都是控制元素的显示隐藏，控制方式不一样，v-if 控制元素的显示隐藏是通过移除/添加元素而v-show控制元素显示隐藏是通过添加css属性，比如display none/block，v-if 相比之下消耗性能会让浏览器重排重绘，所以如果频繁切换的话，建议使用v-show。2.v-if与v-show与v-model，因为if与show的条件是需要双向绑定也就是v-model。（1）定义：用 v-for 指令。
2023-04-12 20:48:19
52
1
原创 Computed（计算属性）
例：input输入框内随机输入，下边显示反转好的字。例：随机给数组添加一个数字，然后计算数组内总和。可用于快速计算视图（View）中显示的属性。3.computed部分用法。2.computed语法。1.computed定义。
2023-04-12 20:11:03
861
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人