![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue学习
MrX_YOUNG
这个作者很懒,什么都没留下…
展开
-
vue中组件的data为什么必须是一个函数
当在组件中使用data时,它的值必须是返回一个对象的函数。如果data不是返回一个对象的函数而是一个对象,那么当我们复用这个组件时,比如说我们有一个toDoList.vue,我们将它复用在购物车,心愿单中,那么,当我们修改购物车中的toDoList的数据时,心愿单中的toDoList的数据也会改变。因为购物车和心愿单中的toDoList引用的都是相同的数据对象。我们希望的是每个组件实例都各自管理自己的数据,因此,每个实例必须生成一个独立的数据对象,当组件上的data是返回一个对象的函数的情况下,组件每次原创 2020-11-06 14:22:55 · 91 阅读 · 0 评论 -
vue_插值操作
Mustache语法(双大括号语法)用于将data中的文本数据插入到HTML中,可以写变量,也可以写简单的表达式,并且是响应式的。<body> <div id="app"> <h2>{{message}}</h2> <h2>{{message}},message</h2> <h2>{{message}},{{firstName}</h2> .原创 2020-07-12 20:06:02 · 152 阅读 · 0 评论 -
计算属性computed
在某些情况下,我们可能需要对数据进行一些转化后再显示,或者需要将多个数据结合起来进行显示。比如有firstname和lastname两个变量,需要在多个地方显示完整的名称,可以用多个{{firstname}}{{lastname}}也可以使用计算属性computed{}<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" /> <meta name=".原创 2020-06-10 15:38:50 · 92 阅读 · 0 评论 -
v-bind动态绑定属性
有时候我们希望将某些属性进行动态绑定比如a元素的href属性比如img元素src属性在这些时候,我们可以使用v-bind指令作用:动态绑定属性缩写(语法糖)::基本使用<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-sca原创 2020-06-10 15:24:10 · 357 阅读 · 0 评论