Vue组件
// 1.创建一个组件构造器
var myComponent = Vue.extend({
template: '<div>This is my first component!</div>'
})
// 2.注册组件,并指定组件的标签,组件的HTML标签为<my-component>
//3.全局注册组件,在实例化的vue外注册
Vue.component('my-component', myComponent)
new Vue({
el: '#app',
//4.用components属性将组件注册到vue实例下
components:{
'my-component':myComponent
});
//5.快速注册组件
Vue.component('my-component',{
template:'<h1>Title</h1>'
})
我们用以下几个步骤来理解组件的创建和注册:
- Vue.extend()是Vue构造器的扩展,调用Vue.extend()创建的是一个组件构造器。
- Vue.extend()构造器有一个选项对象,选项对象的template属性用于定义组件要渲染的HTML。
- 使用Vue.component()注册组件时,需要提供2个参数,第1个参数时组件的标签,第2个参数是组件构造器。
- 组件应该挂载到某个Vue实例下,否则它不会生效。
注意:注册组件必须在实例化vue之前!
xss(跨站脚本攻击)(Cross Site Scripting)
恶意攻击者往Web页面里插入恶意Script代码,当用户浏览该页之时,嵌入其中Web里面的Script代码会被执行,从而达到恶意攻击用户的目的。