专栏首页编程微刊Vue.js组件的重要选项

Vue.js组件的重要选项

实例化Vue对象一些很重要的选项,Vue的所有数据都是放在data里面的,Vue的参数是个对象,对象里面的字段叫做data,data里面也是对象,data也可以写作是this.a,this.b来取到数据 2:methods是一个方法,这个方法打印出 了a的数值,取到data里面的数据

3:监听 我们监听了data数据里面的a, a对应的是一个方法,意思就是我们监听所有a的变化,a在dosomething进行了一个加1 的操作,watch指定的这个方法就会去执行,所以val的值是2,oldval的值还是之前的1

4:那么Vue里面的东西和页面页面展示究竟有什么联系? 这三者看似想同,实际也有所区别 v-text处理过HTML,v-html保存了HTML的结构 当右边Vue里面的a通过方法执行自增的话,左边模板中的a也会随之进行更新

5:常用的v-if , v-show 控制元素的显示与隐藏 v-if是直接渲染dom元素 v-show是通过display none 来对div进行隐藏,在代码里面能看到这个dom元素的

6:v-for 列表的渲染方法,循环渲染,我们的数据源是这样的,items里面有一个对象的列表 我们在前端对数组进行渲染的话使用的就是v-for 命令,in后面的对象值得就是data数据源里面的列表 通过循环体里面对象的属性(banana 和apple)取得

7:事件的绑定 doThis是从methods里面取得的,不是从data里面取得,,简写的模式是@

8:对dom元素属性的操作,简写的方式是: 假如里面是对象{},这个red指的是class的名字,isred指的是是否有这个class的一个判断 假如里面是数组【】,classA和classB在data里面就是一个字符串,是要直接展示出来的,比如赋值给A和Bbanana和apple

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 动态表格之查看、删除、编辑

    祈澈菇凉
  • 【前端统计图】echarts实现简单柱状图项目地址下载:

    祈澈菇凉
  • 【前端统计图】echarts实现单条折线图

    祈澈菇凉
  • vue.js-详解三大流行框架VUE_快速进阶前端大咖-Vue基础

    MVX模式简介: MVX框架模式:MVC+MVP+MVVM MVC: Model模型+View视图+Controller控制器

    达达前端
  • (31)Vue安装

    https://github.com/vuejs/vue-devtools#vue-devtools

    达达前端
  • 测试用例的设计方法(一)

    1.定义 是把所有可能的输入数据,即程序的输入域划分成若干部分(子集),然后从每一个子集中选取少数具有代表性的数据作为测试用例。该方法是一种重要的,常用的黑盒...

    葆宁
  • React学习(6)—— 高阶应用:非受控组件

    在大部分情况下,推荐使用 受控组件 来实现表单、输入框等状态控制。在受控组件中,表单等数据都有React组件自己处理。这里将介绍另外一种非受控组件,表单的数据有...

    随风溜达的向日葵
  • React 非受控组件

    在大部分情况下,推荐使用 受控组件 来实现表单、输入框等状态控制。在受控组件中,表单等数据都有React组件自己处理。这里将介绍另外一种非受控组件,表单的数据有...

    随风溜达的向日葵
  • 看过无数Java GC文章,这5个问题你也未必知道!

    垃圾回收针对不同的分区又分为MinorGC和FullGC,不同分区的触发条件又有不同。总体来说GC的触发分为主动和被动两类:

    轩辕之风
  • 如何通过软引用和弱引用提升JVM内存使用性能!

    初学者或初级程序员在面试时如果能证明自己具有分析内存用量和内存调优的能力,这相当有利,因为这是针对5年左右相关经验的高级程序员的要求。而对于高级程序员来说,如果...

    Java后端技术

扫码关注云+社区

领取腾讯云代金券