随笔分类 -  vue

新闻头条项目
摘要：1.请求拦截器 相应拦截器的使用 2.dayjs的引入与使用 3.loadsh在项目中怎样使用 4.高亮显示关键字 忘记(解决 利用RegExp正则 把关键字的部分匹配出来 然后利用样式替换 在返回给数组 ) 5.window.URL.createObjectURL()可以获取图片的地址 6.jso 阅读全文
posted @ 2021-10-07 14:54 冰镇汽水 阅读(30) 评论(0) 推荐(0)
自定义组件的v-model的使用
摘要：一个组件上的 v-model 默认会利用名为 value 的 prop 和名为 input 的事件，但是像单选框、复选框等类型的输入控件可能会将 value attribute 用于不同的目的。model 选项可以用来避免这样的冲突： model: { prop: 'isfollow', event 阅读全文
posted @ 2021-09-28 15:18 冰镇汽水 阅读(118) 评论(0) 推荐(0)
私有定义指令
摘要：1.directives节点 2.在定义时不需要使用v-前缀 3.函数中的el指向绑定的元素 触发的函数必须是bind directives:{ color:{ bind(el){ el.style.color="red" } } } 还可传值 <p v-color="'blue'">jjjj</p 阅读全文
posted @ 2021-08-27 15:13 冰镇汽水 阅读(75) 评论(0) 推荐(0)
插槽slot
摘要：1.一般用在组件封装时。 2.每个插槽都有name，默认为default。 3.v-slot把内容填充到指定名称的插槽上，简写为# 4.v-slot必须写在template上或者组件上。 5.插槽还可以传递数据 作用域插槽 <div class="title"> <slot name="one" m 阅读全文
posted @ 2021-08-26 19:54 冰镇汽水 阅读(38) 评论(0) 推荐(0)
动态组件
摘要：1.vue内置<component>组件 相当于一个占位符，它的is属性的值是要显示的组件 在运行时发现一个问题，每次控制组建的显隐时都会触发created，destory函数，为了防止这样的消耗， 使用keep-alive，解决。其中include是名称匹配的缓存，exclude是名称匹配的不缓存 阅读全文
posted @ 2021-08-26 19:29 冰镇汽水 阅读(101) 评论(0) 推荐(0)
this.$nextTick
摘要：this.$nextTick这个方法作用是当数据被修改后使用这个方法会回调获取更新后的dom再渲染出来 例子：想让输入框显示出来后自动获取焦点 showBtn(){ this.isVisible=true; //获取ref 获取不到 //原因是啥呢：在数据改变时 需要经历 beforeUpdate阶 阅读全文
posted @ 2021-08-23 17:12 冰镇汽水 阅读(64) 评论(0) 推荐(0)
ref的使用
摘要：1.主要作用：获取dom元素或者组件的引用。 $refs是vue内置的空对象， 2.使用：ref=”自定义的名字“ 获取 this.$refs.自定义名字 当获取的是组件的引用时，可以操作组件。 阅读全文
posted @ 2021-08-23 17:10 冰镇汽水 阅读(123) 评论(0) 推荐(0)
vue组件中的数据共享
摘要：1.父组件向子组件中传送数据 方法：使用自定义属性，即在子组件中利用props接收父组件中利用自定义属性传过来的值 在这里请注意 需要用v-bind绑定自定义属性进行传值，否者传过来的是字符串。 <Left :mes="message" :ages="age"></Left> 上述代码如果mes不绑 阅读全文
posted @ 2021-08-23 16:56 冰镇汽水 阅读(190) 评论(0) 推荐(0)
scoped的使用
摘要：1.为什么应用 解决组件中的样式冲突，让自己的样式只在自己的作用域中应用，不用影响别的组件 实际应用：在使用第三方库组件时，需要更改样式，就可以用这种方法， scoped的原理：给每个元素增加一个自定义的属性用来区分，即 h2[data-v-01]{样式},给这个组件所有的标签都增加上这个自定义属性 阅读全文
posted @ 2021-08-22 21:10 冰镇汽水 阅读(170) 评论(0) 推荐(0)
vue组件props的注意点
摘要：1.props是自定义属性允许当前使用者为当前组件赋初值。 2.props是只读的！千万别直接修改 3.props的对象格式：更多属性请参考： https://www.cnblogs.com/hongdoudou/p/12673732.html props:{ default:, require:, 阅读全文
posted @ 2021-08-22 20:55 冰镇汽水 阅读(200) 评论(0) 推荐(0)
纠正vue-cli使用组件时的错误思想
摘要：错误思想：想把全局组件定义到App.vue中，只想着App.vue是根组件 纠正：当时没有想到组件之间是相互独立的，而且根组件也只是组件而已，即使我把全局组件定义到App.vue中，别的组件也访问不到，更别提根本就定义不了！所以全局组件需要定义到入口main.js中，在组件中只能定义局部组件！ 阅读全文
posted @ 2021-08-22 20:46 冰镇汽水 阅读(44) 评论(0) 推荐(0)
vue生命周期
摘要：export default({ data:function(){ return {username:"popo",num:0} }, methods:{ change(){ this.username="hahah" }, }, //创建阶段 // 第一阶段 beforeCreate 此时prop 阅读全文
posted @ 2021-08-22 20:31 冰镇汽水 阅读(42) 评论(0) 推荐(0)
学习axios
摘要：1.ajax，jqueryAjax，fetch，axios的比较 几种方式的对比 ajax： 【优点：局部更新；原生支持】 【缺点：可能破坏浏览器后退功能；嵌套回调】 jqueryAjax： 【在原生的ajax的基础上进行了封装；支持jsonp】 fetch： 【优点：解决回调地狱】 【缺点：API 阅读全文
posted @ 2021-08-21 20:51 冰镇汽水 阅读(60) 评论(0) 推荐(0)
vue的侦听器（immediate，deep）
摘要：1.侦听器的定义： 第一种：方法格式 watch：{ //侦听的名字 username(newValue,odValue){ } } 第二种：对象格式 watch：{ //侦听的名字 username:{ handler(newValue,odValue){}， immediate：true， de 阅读全文
posted @ 2021-08-21 20:28 冰镇汽水 阅读(471) 评论(0) 推荐(0)
过滤器
摘要：1.过滤器分为全局过滤器与局部过滤器。最常用的是全局过滤器。 2.过滤器的使用：一般在{{}}插值表达式中使用，在 | 管道符的后面eg： {{item.time|dates}} 3.一定记得过滤器需要有返回值，返回值！！ 4.过滤器会有一个默认的参数，也就是第一个参数是管道符前面的内容。 阅读全文
posted @ 2021-08-20 20:37 冰镇汽水 阅读(28) 评论(0) 推荐(0)
v-if与v-show的不同
摘要：1.v-if是动态的创建或移除元素来实现元素的显隐；v-show控制样式的display来显示或者隐藏 2.若要频繁的切换元素的显示状态，用v-show性能更好 3.若刚进入页面，某些元素默认不需要被展示，而且后期这个元素很可能也不需要展示出来，此时用v-if 需要注意的是，当一个元素默认在css中 阅读全文
posted @ 2021-08-20 19:46 冰镇汽水 阅读(64) 评论(0) 推荐(0)
v-bind与v-model的比较
摘要：相同点： 1.数据源变化，则页面数据会发生变化 不同点： 1.v-model是双向数据绑定，即页面内容变化数据源也会变化。而v-bind是单向数据绑定，他不会。 2.v-model适用于表单元素中，例如：在input中，使用v-model绑定，底层实现的就是绑定的value，在checkbox，绑定 阅读全文
posted @ 2021-08-20 19:32 冰镇汽水 阅读(291) 评论(0) 推荐(0)
vue的mvvm思想
摘要：vue的特性：数据驱动视图，双向数据绑定。 Model-View-ViewModel： Model 层代表数据模型，也可以在 Model 中定义数据修改和操作的业务逻辑；View 代表 UI 组件，它负责将数据模型转化成 UI 展现出来，ViewModel 是一个同步 View 和 Model 的对 阅读全文
posted @ 2021-08-20 19:24 冰镇汽水 阅读(47) 评论(0) 推荐(0)