Vue.js全局API解析

vue.js全局api解析

vue.directive自定义指令

颜色

vue.directive申请一个自定义指令，第一个参数是指令名字，第二个是函数。

以我的理解el是当期的元素，binding是相当于一个v-jsfan的对象，value是获取color的值red

vue.extend构造器的延伸

常用来更新数组，因为vue更新下标是不会响应的,所以用vue.set()

vue的生命周期(钩子函数)

{{message}}

加分

销毁

首先运行1，2，3，4 ，，点击加分运行5，6，，点击销毁运行9，10

template 制作模版

一、直接写在选项里的模板

var app=new vue({

el:'#app',

data:{

message:'hello vue!'

},

template:`

我是选项模板

` })

二、写在标签里的模板

三、写在script标签里的模板

这种写模板的方法，可以让模板文件从外部引入。

以上都是在app的p中直接放模板出来

component 初识

一、全局化注册组件

component 组件props 属性设置

一、定义属性并获取属性值

定义属性我们需要用props选项，加上数组形式的属性名称，例如：props:[‘here’]。在组件的模板里读出属性值只需要用插值的形式，例如{{ here }}.

这样就能获得here的属性值为china

三、在构造器里向组件中传值

var app=new vue({

el:'#app',

data:{

message:'sichuan'

},

components:{

"panda":{

template:`

panda from {{ here }}.

`, props:['here'] } } })

可以获取构造器中message的值sichuan

component 父子组件关系

其中city要放在ang的上面，不然识别不到

component 标签

changecomponent

通过点击按钮，来实现改变模板a，b，c。一定要是is属性才可以。