![](https://img-blog.csdnimg.cn/20190801162019772.jpeg?x-oss-process=image/resize,m_fixed,h_224,w_224)
vue
文章平均质量分 54
我学习vue的经验,不过需要说句,个人觉得官方文档讲的很好了,认真看一遍会有所收获的
刘久江
这个作者很懒,什么都没留下…
展开
-
Vue中VNode的属性
示例:this.$createElement('img', { style: 'width: 100%',attrs: {src: 'https://scpic.chinaz.net/files/pic/pic9/201910/zzpic20739.jpg'}}){ // 和`v-bind:class`一样的 API // 接收一个字符串、对象或字符串和对象组成的数组 'class': { foo: true, bar: false }, /...原创 2022-02-18 14:53:30 · 1303 阅读 · 0 评论 -
Vue常用修饰符
1.lazy顾名思义,lazy修饰符作用是,改变输入框的值时绑定的lazyValue不会改变,当光标离开输入框时,v-model绑定的值lazyValue才会改变。<!--html--><input type="text" v-model.lazy="lazyValue"><div>{{lazyValue}}</div><!--data-->data() { return { lazyValue...原创 2022-01-24 17:37:41 · 2713 阅读 · 0 评论 -
vue由浅入深的50个知识点
荣耀黄金1. Vue的优点?Vue的缺点?优点:渐进式,组件化,轻量级,虚拟dom,响应式,单页面路由,数据与视图分开缺点:单页面不利于seo,不支持IE8以下,首屏加载时间长2. 为什么说Vue是一个渐进式框架?渐进式:通俗点讲就是,你想用啥你就用啥,咱也不强求你。你想用component就用,不用也行,你想用vuex就用,不用也可以3. Vue跟React的异同点?相同点:1.都使用了虚拟dom 2.组件化开发 3.都是单向数据流(父子组件之间,不建议子修改父传下转载 2021-07-14 11:23:51 · 685 阅读 · 0 评论 -
Vue中的Provide/Inject 实现响应式数据
介绍:provide/inject 这对选项需要一起使用,以允许一个祖先组件向其所有子孙后代注入一个依赖,不论组件层次有多深,并在起上下游关系成立的时间里始终生效。缺点:祖先组件不需要知道哪些后代组件使用它提供的属性。 后代组件不需要知道被注入的属性来自哪里。 会将应用程序中的组件与它们当前的组织方式耦合起来,使重构变得更加困难。 所提供的属性是非响应式的。最近在使用这个进行深层嵌套传值的时候,发现只能传固定值,传递不了响应式的数据,查官网提示得:provide 和 inject..原创 2021-07-01 17:14:55 · 582 阅读 · 0 评论 -
vue中keep-alive
Keeplive组件介绍 ⑴.为什么要使用keep-alive在vue中,我们使用component内置组件或者vue-router切换视图的时候,由于vue会主动卸载不使用的组件,所以我们不能保存组件之前的状态,而我们经常能遇到需要保存之前状态的需求,例如:搜索页(保存搜索记录),列表页(保存之前的浏览记录)等等。⑵.keep-alive的作用Keep-alive是一个vue的内置组件,它能将不活动的组件保存下来,而不是直接销毁...原创 2021-02-28 23:02:27 · 609 阅读 · 0 评论 -
Vue中key的作用
Vue中key属性的作用在列表渲染时使用key属性 使用key属性强制替换元素在列表渲染时使用key属性相信大多数Vue开发者接触到key属性的时候是使用v-for进行列表渲染的时候,如果不使用key属性,Vue会产生警告,那么在这个时候key属性的作用是什么呢?官方文档中说:当 Vue.js 用v-for正在更新已渲染过的元素列表时,它默认用“就地复用”策略。如果数据项的顺序被改变,Vue 将不会移动 DOM 元素来匹配数据项的顺序, 而是简单复用此处每个元素,并且确保它在特定索.转载 2021-03-23 11:06:44 · 250 阅读 · 0 评论 -
vue实战技巧
1. 内部监听生命周期函数今天产品经理又给我甩过来一个需求,需要开发一个图表,拿到需求,瞄了一眼,然后我就去echarts官网复制示例代码了,复制完改了改差不多了,改完代码长这样<template> <div class="echarts"></div></template><script>export default { mounted() { this.chart = echarts.init(this.$el)转载 2020-07-03 13:55:50 · 295 阅读 · 0 评论 -
exports、module.exports和export、export default
exports、module.exports和export、export default原创 2020-06-30 17:51:55 · 151 阅读 · 0 评论 -
Vue中的 computed 和 watch
computedcomputed看上去是方法,但是实际上是计算属性,它会根据你所依赖的数据动态显示新的计算结果。计算结果会被缓存,computed的值在getter执行后是会缓存的,只有在它依赖的属性值改变之后,下一次获取computed的值时才会重新调用对应的getter来计算watcherwatcher 更像是一个 data 的数据监听回调,当依赖的 data 的数据变化,执行回调...原创 2020-02-25 17:11:55 · 229 阅读 · 0 评论 -
浅析vue中双向数据绑定
一:双向数据绑定简介:vue是一个mvvm框架,即数据双向绑定,即当数据发生变化的时候,视图也就发生变化,当视图发生变化的时候,数据也会跟 着同步变化。原理:var obj = { foo: 'foo' } Object.defineProperty(obj, 'foo', { get: function () { ...原创 2019-05-28 17:10:30 · 904 阅读 · 0 评论 -
vue组件间的传值
1.props和$emit 父组件向子组件传递数据是通过prop传递的,子组件传递数据给父组件是通过$emit触发事件来做到的。 2.特性绑定$attrs和$listeners 如果父组件A下面有子组件B,组件B下面有组件C,这时如果组件A想传递数据给组件C怎么办呢? 如果继续用上面的方法,会变得非常复杂,不利于维护;Vue 2.4开始提供了$attrs和$listeners来解决这个问...原创 2019-05-15 11:34:16 · 176 阅读 · 0 评论 -
vue中的 虚拟DOM
一、真实DOM和其解析流程 浏览器渲染引擎工作流程都差不多,大致分为5步,创建DOM树——创建StyleRules——创建Render树——布局Layout——绘制Painting第一步,用HTML分析器,分析HTML元素,构建一颗DOM树(标记化和树构建)。 第二步,用CSS分析器,分析CSS文件和元素上的inline样式,生成页面的样式表。...原创 2019-04-26 16:33:28 · 1734 阅读 · 0 评论 -
vue中组件常用传值方式
.1 父子组件间传值父组件给子组件传值,直接通过props传值<custom content="hello world"></custom>复制代码子组件给父组件传值,通过 emit发送事件this.$emit('chooseType', type)复制代码父组件接收事件:<custom content="hello world" @ch...原创 2019-03-05 20:26:45 · 210 阅读 · 0 评论 -
vue常用知识点
用了vue.js挺久的了,最近逛了逛社区看了看vue的面试题或者知识点什么的,感觉自己学的太局限了,在这我记录下我认为不错的或者常用的知识点,这里我有摘录别人的当然也有自己平时碰见的,也免忘记吧。1. 介绍下MVVM开发模式MVVM 是Model-View-ViewModel 的缩写,它是一种基于前端开发的架构模式,其核心是提供对View 和 ViewModel 的双向数据绑定,这使...原创 2019-03-05 16:06:03 · 509 阅读 · 0 评论 -
vue 常用指令
1、创建一个vue实例 vue的一个特点就是数据驱动界面,一旦对js中的数据进行修改,界面中用到数据的地方也会立马做出更改。为了对界面进行操纵,需要先获取到界面的标签元素,并实例化一个vue实例。例如HTML中有一个div:<div id="app"> <p>{{msg}}</p></div>在js中实例化一个vue: ...转载 2018-11-19 15:30:33 · 173 阅读 · 0 评论 -
vue中的:作用
在使用Vue中经常看到HTML中有些标签属性前面添加了“:”,有些没有。查看Vue的API文档时我们会发现冒号“:”其实是v-bind的缩写。原创 2018-11-19 17:13:23 · 6253 阅读 · 0 评论