随笔分类 - vue
摘要：一个组件上的`v-model`默认会利用名为`value`的prop(属性)和名为input的事件，但是像单选框、复选框等类型的输入控件可能会将`value`特性用于不同的目的。这时候我们可以在定义组件的时候，通过设置`model`选项可以用来实现不同的处理方式。 在创建组件的时候，添加`model
阅读全文
摘要：当我们需要在操作组件后引起组件之外的元素发生变化时，就需要是这里的内容。比如：当选中书后，自动显示您选中的书名。其中书籍列表是使用组件写的。显示选中书籍名是在组件之外。 在添加事件的时候需要注意一下事项： 1、在定义组件时`Vue.component(组件名，{props(参数),template(
阅读全文
摘要：定义组件时，如果是需要参数传递则，将要传递的参数放在`props`中，`props`可以是一个数组也可以是一个字典，字典中可以定义是否是必须传递和参数的类型。如下： porps:{ books:{ type: Array, required: true, default: '四大名著' } } 在传
阅读全文
摘要：当某些html代码是重复使用时，就可以将其写成组件，直接调用，方便以后的修改。 需要注意的是：定义的组件只能在注册过的代码块中使用，且定义组件的Vue.component是 和注册代码是同级的。 其形式为： Vue.component("组件名", { template: "定义的html代码",
阅读全文
摘要：v-model指定可以实现表单值与属性的双向绑定。即表单元素中更改的值会自动的更新属性中的值，属性中的值发生变化会自动更新表单里的值。 绑定的属性和事件 v-model在内部输入不同的元素使用不同的属性并抛出不同的事件。 text和textarea元素使用value属性和input事件； check
阅读全文
摘要：监听属性可以针对某个属性进行监听，当监听的属性的值发生了变化，则会执行相应的函数。 监听的函数要写在vue的watch属性中。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" c
阅读全文
摘要：一般情况下属性都是放在data中的，但是有些属性可能是需要经过一些计算才能得出，那么，我们可以把这类属性变成计算属性。此时，需要将这些计算属性写到computed中，和将属性写在data中是一样的。表面上看，计算属性和methods一样，实际上，计算属性更加智能，他是基于它们的响应式依赖进行缓存的。
阅读全文
摘要：v-on： v-on是给元素绑定事件，其简写是“@+事件名” event事件： 将event元素传递给函数时，在传递时一定要写成“$event”，而函数中的形参是什么都无所谓了。 事件修饰符： .prevent：阻止默认时间的执行； .stop：event.stopPropagation，阻止事件冒
阅读全文
摘要：当vue的data中的值发生变化后，视图中引用部分的值是否会同时发生变化呢？首先，我们要知道有哪些更新的类型。 更新的类型 1、直接赋值更新。this.heros=[' ']，模板会立即更新。 2、通过函数更新。this.heros.push("xx)。 更新的函数： push()：在数组最后添加元
阅读全文
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src="htt
阅读全文