随笔分类 -  vue

摘要:1.获取dom元素 2.获取子组件中的data和方法 阅读全文
posted @ 2022-04-29 16:45 果果1024 阅读(31) 评论(0) 推荐(0)
摘要:watchEffect 立即执行,没有惰性 不需要传递你要监听的内容,自动会感知代码依赖 不需要传递太多参数,只需传递一个回调函数 只能获取之前数据当前的值,无法获取数据之前的值 watch 具备一定的惰性 有两个参数,可以拿到原始值(prevValue)和当前值(currentValue) Wat 阅读全文
posted @ 2021-11-29 10:40 果果1024 阅读(115) 评论(0) 推荐(0)
摘要:https://www.cnblogs.com/lieone/p/11856330.html 阅读全文
posted @ 2021-11-16 17:57 果果1024 阅读(49) 评论(0) 推荐(0)
摘要:{ // 全局formater "editor.tabSize": 4, "editor.detectIndentation": false, //"editor.defaultFormatter": "esbenp.prettier-vscode", // vetur "[vue]": { "ed 阅读全文
posted @ 2021-11-16 16:05 果果1024 阅读(97) 评论(0) 推荐(0)
摘要:npm install --save nprogress //导入import NProgress from 'nprogress'import 'nprogress/nprogress.css' router.beforeEach((to, from, next) => { NProgress.s 阅读全文
posted @ 2021-11-12 13:56 果果1024 阅读(60) 评论(0) 推荐(0)
摘要:https://zhuanlan.zhihu.com/p/27407024 阅读全文
posted @ 2021-11-04 11:35 果果1024 阅读(27) 评论(0) 推荐(0)
摘要:<component v-bind:is="currentTabComponent"></component> 应用场景:tab切换 阅读全文
posted @ 2021-10-24 18:54 果果1024 阅读(39) 评论(0) 推荐(0)
摘要:事件修饰符:v-on:.stop、.prevent、.capture、.self、.once 按键修饰符:.enter、.tab、.delete(捕获“删除”和“退格”键)、.esc、.space、.up、.down、.left、.right 系统修饰符:.ctrl、.alt、.shift、.met 阅读全文
posted @ 2021-10-23 19:29 果果1024 阅读(60) 评论(0) 推荐(0)
摘要:全局前置守卫:beforeEach、beforeResolve、afterEach 使用场景:1.用于登录验证(及用户长时间不登录的时候,跳出是否满意) 3.修改title,注意1中也可以修改,但是万一不跳到下一个页面,在1中修改会出错 路由独享守卫:beforeEnter 用于需要特别处理的情况( 阅读全文
posted @ 2021-10-23 12:32 果果1024 阅读(1082) 评论(0) 推荐(0)
摘要:1. npm install process 2. "serve": "vue-cli-service serve --mode local", "serve-qalocal": "vue-cli-service serve --mode qalocal" 3. 新建如下两个文件: .env.loc 阅读全文
posted @ 2021-10-23 12:03 果果1024 阅读(789) 评论(0) 推荐(0)
摘要:写在一个函数中方便优化 getAddNum() { const timer = setInterval(() => { this.nums = this.nums+1 }, 500); // 通过$once来监听定时器,在beforeDestroy钩子可以被清除。 this.$once("hook: 阅读全文
posted @ 2021-10-23 11:41 果果1024 阅读(110) 评论(0) 推荐(0)
摘要:加载渲染过程 父beforeCreate->父created->父beforeMount->子beforeCreate->子created->子beforeMount->子mounted->父mounted 子组件更新过程 父beforeUpdate->子beforeUpdate->子updated 阅读全文
posted @ 2021-10-23 11:28 果果1024 阅读(73) 评论(0) 推荐(0)
摘要:<!DOCTYPE html><html><head><meta charset="utf-8"><title>Vue 测试实例 - 菜鸟教程(runoob.com)</title><script src="https://unpkg.com/vue/dist/vue.js"></script></ 阅读全文
posted @ 2021-10-19 09:55 果果1024 阅读(58) 评论(0) 推荐(0)
摘要:<!DOCTYPE html><html><head><meta charset="utf-8"><title>Vue 测试实例 - 菜鸟教程(runoob.com)</title><script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.j 阅读全文
posted @ 2021-10-18 18:27 果果1024 阅读(33) 评论(0) 推荐(0)
摘要:1、<router-link to="需要跳转到页面的路径">2、this.$router.push()跳转到指定的url,并在history中添加记录,点击回退返回到上一个页面3、this.$router.replace()跳转到指定的url,但是history中不会添加记录,点击回退到上上个页面 阅读全文
posted @ 2021-10-18 18:02 果果1024 阅读(66) 评论(0) 推荐(0)
摘要:hash模式 #后面 hash 值的变化,并不会导致浏览器向服务器发出请求,浏览器不发出请求,也就不会刷新页面。每次 hash 值的变化,会触发hashchange 这个事件,通过这个事件我们就可以知道 hash 值发生了哪些变化,然后我们便可以监听hashchange来实现更新页面部分内容的。 h 阅读全文
posted @ 2021-10-18 17:57 果果1024 阅读(354) 评论(0) 推荐(0)
摘要:computed: 1.(1)存在依赖型数据( 2)依赖型数据发生改变这两个条件,computed才会重新计算。 2.在template调用时,直接写计算属性名即可(类似data) 1.watch擅长处理的场景:一个数据影响多个数据 2.computed擅长处理的场景:一个数据受多个数据影响 met 阅读全文
posted @ 2021-10-18 17:19 果果1024 阅读(81) 评论(0) 推荐(0)
摘要:当组件需要复用的时候,data必须写成对象的形式,并且返回。vue实例之所以不需要,是因为vue实例不需要复用。当组件需要复用时,写成data对象的形式并且返回,才会使各个被复用的组件中的数据不发生干扰。(对比methods,methods可以复用,还是调用相同方法,但是data的数据不行) 阅读全文
posted @ 2021-10-13 17:54 果果1024 阅读(119) 评论(0) 推荐(0)
摘要:卡槽的作用 常用的一种子传父的通信方式,作用域插槽其实就是带数据的插槽,即带参数的插槽,简单的来说就是子组件提供给父组件的参数,该参数仅限于插槽中使用,父组件可根据子组件传过来的插槽数据来进行不同的方式展现和填充插槽内容。 卡槽经典案例element-ui中的表格 <template slot-sc 阅读全文
posted @ 2021-09-29 16:04 果果1024 阅读(379) 评论(0) 推荐(0)
摘要:1.数组的解构赋值 let [x = 1, y = x] = []; // x=1; y=1 let [x = 1, y = x] = [2]; // x=2; y=2 let [x = 1, y = x] = [1, 2]; // x=1; y=2 let [x = y, y = 1] = []; 阅读全文
posted @ 2021-09-28 11:12 果果1024 阅读(51) 评论(0) 推荐(0)