vue

  • sync修饰
    (1)双向数据绑定,父子组件之间信息的交互

    1⃣️在自组件中使用this.emmit('toFather'),子组件产生一个tofather事件,然后在父组件中通过@进行监听,那么可以实现通信过程 
    2⃣️使用简单的方式传递,如上图中emmit(updete:title),然后在v-bind:title.sync='title',从而实现双向数据绑定

    (2)双向数据绑定,使用v-model

    通过在自组件中使用model 定义 prop event ,从而可以实现父子组件之间通过v-model实现通信,或者不定义model ,使用默认的的prop:value,enent:input

  • keep-alive
    <keep-alive><My-component /> <keep-alive>  可以实现缓存
  • 作用域插槽
    这个其实就是可以使用自组件中的数据,使用slot-scope接受自组件中的数据
  • 自组件访问父级组件
    1⃣️ let father = this.$parent
    2⃣️通过依赖注入
  • 计算属性
    刚开始在学习计算属性的时候,一直默认的认为是一个函数,但是在调用的时候,是不用加()的,这样的话,在认为是一个函数就不对了,其实就是类似于
    data中的数据,只不过会有缓存和更新。例如使用的时候直接{{computed}},通俗的说,可以单纯的将它作为一个data值
  • method方法
    调用方法的时候,如果不传递值的话,那么可以不用加入()
  • 混入 minxins

自定义指令
通过Vue.directive(name,{})
Vuex

  • 三部分构成 state actions mutations
  • state
    此部分存放数据,可以通过mapStated获取到数据。

  • actions
    可以使用异步,通过this.$store.dispathc()触发

  • mutatios

    mutatios
    必须是同步,通过this.emmit()触发

  • 步骤:

     Vue.use(Vuex)
    
    const store = new Vuex.Store({
    state: {
    count: 0
    },
    mutations: {
    increment (state) {
    state.count++
    }
    },
    actions: {
    increment (context) {
    context.commit('increment')
    }
    }
    })

      

Vue一些重要的知识点的更多相关文章

  1. vue前端面试题知识点整理

    vue前端面试题知识点整理 1. 说一下Vue的双向绑定数据的原理 vue 实现数据双向绑定主要是:采用数据劫持结合发布者-订阅者模式的方式,通过 Object.defineProperty() 来劫 ...

  2. Vue.js中前端知识点总结笔记

    1.框架和库的区别: 框架:framework 有着自己的语法特点.都有对应的各个模块库 library 专注于一点 框架的好处: 1.提到代码的质量,开发速度 2.提高代码的复用率 3.降低模块之间 ...

  3. vue中的一些知识点--多看文档

    重温vue,一些知识点简单记录. 1.我们都知道当数据变化时,视图会重新渲染.注意:只有当vue实例被创建时,data中存在的属性才是响应式的.后续新添加的属性不会触发视图变化. 使用 Object. ...

  4. vue面试题,知识点汇总(有答案)

    一. Vue核心小知识点 1.vue中 key 值的作用 key 的特殊属性主要用在 Vue的虚拟DOM算法,在新旧nodes对比时辨识VNodes.如果不使用key,Vue会使用一种最大限度减少动态 ...

  5. vue.js的一些知识点

    1. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8& ...

  6. vue较深入的知识点

    1 理解何为虚拟节点 虚拟dom是什么? 虚拟dom就是通过js对象来模拟描述dom树,包括tag,attr, children等属性来代表标签名,属性,子元素等.由于不需要有操作dom的方法,所以比 ...

  7. MVC,MVVM,MVP的区别/ Vue中忽略的知识点!

    按照顺序学习: https://scotch.io/courses/build-an-online-shop-with-vue/hello-world Vue Authentication And R ...

  8. vue经验 - 细节小知识点汇总(更新中...)

    1. $refs 数据这么绑定的: 然后在created中抛出来,猜猜看看打印的是两个什么? 结果如下: 第一个跑出来了,第二个,却undefiend,没有东西?!... 后来去官网查看$refs的解 ...

  9. vue有关绑定的知识点

    一.v-bind绑定class 1.对象的形式 <div :class="{text-danger:true}"></div> 数组形式绑定class &l ...

  10. vue组件的基本知识点

    1. 组件中 is 的特性: 有些 HTML 元素,诸如 <ul>.<ol>.<table> 和 <select>,对于哪些元素可以出现在其内部是有严格 ...

随机推荐

  1. 去掉video视频播放器下的下载按钮

    去掉video视频播放器下的下载按钮: video::-internal-media-controls-download-button { display:none; } video::-webkit ...

  2. Android学习笔记_58_清除手机应用程序缓存

    通过查看手机设置(setting)源代码,发现它里面获取应用大小和缓存大小是通过PackageManager里面的getPackageSizeInfo方法.然而此方法时私有的,因此通过反射调用此方法. ...

  3. 10474 - Where is the Marble?(模拟)

    传送门: UVa10474 - Where is the Marble? Raju and Meena love to play with Marbles. They have got a lot o ...

  4. UliPad安装

    1 http://www.cnblogs.com/dolphin0520/p/4012804.html 2 http://www.iplaypython.com/editor/ulipad.html

  5. eclipse 突然debug模式不能正常运行了

    eclipse 突然debug模式不能正常运行了,但非debug模式却能正常运行.debug模式不能正常启动的现象描述如下:    点击eclipse debug按钮,console窗口显示tomca ...

  6. LeetCode 中级 - 第k个排列(60)

    可以用数学的方法来解, 因为数字都是从1开始的连续自然数, 排列出现的次序可以推 算出来, 对于n=4, k=15 找到k=15排列的过程: 1 + 对2,3,4的全排列 (3!个) 2 + 对1,3 ...

  7. FirstBird--项目流程

    创建项目(英文路径)—–img图片文件 创建窗体–设置大小(Basic—size–>320*480)—最大化功能禁用(Expert–>setResizable(false)) 添加面板–设 ...

  8. CentOS7 64位下 MySQL5.7的安装与配置(YUM)

    趁着11.11的时候在阿里云上弄了一云服务ECS(作为自己的节日礼物 > _ <) ,系统为CentOS的,打算弄一个人博客之类的,这些天正在备案当中(不知得多久). 忙里偷闲,在中午休息 ...

  9. 3.从print到I/O

    为何对双引号念念不忘? >>> print("hello, world!") hello, world!   平x而论,既然在意双引号的去掉,为何不在意括号的去掉 ...

  10. python中如何统计一个类的实例化对象

    类中的静态变量 需要通过类名.静态变量名 来修改 :通过对象不能修改 python中如何统计一个类的实例化对象?? class Person: #静态变量count,用于记录类被实例化的次数 coun ...