ref屬性
? 1胳施、被用來(lái)給元素或子組件注冊(cè)引用信息(id的替代者)
? 2溯祸、應(yīng)用在html標(biāo)簽上獲取的是真實(shí)DOM元素,應(yīng)用在組件標(biāo)簽上是組件實(shí)例對(duì)象(vc)
? 3舞肆、使用方式:
? ? ???? 打標(biāo)識(shí):<h1 ref = "XXX">.....</h1>或? <School ref="xxx"/>
? ? ???? 獲冉垢ā:this.$refs.xxx
配置項(xiàng)props
? 功能:讓組件接受外部傳過(guò)來(lái)的數(shù)據(jù)
? ? ? ? (1)、傳遞數(shù)據(jù)
? ? ? ? ? ? ? <Demo name="xxx"/>
? ? ? ? (2)椿胯、接受數(shù)據(jù)
? ? ? ? ? ? ? 第一種方式(只接受):
? ? ? ? ? ? ? props:['name']
? ? ? ? ? ? 第二種方式(限制類(lèi)型):
? ? ? ? ? ? props:{
? ? ? ? ? ? ? ? name:Number
? ? ? ? ? ? }
? ? ? ? ? ? 第三種方式(限制類(lèi)型筷登、限制必要性、指定默認(rèn)值):
? ? ? ? ? ? props:{
? ? ? ? ? ? ? ? name:{
? ? ? ? ? ? ? ? ? type:String,//類(lèi)型
? ? ? ? ? ? ? ? ? required:true,//必要性
? ? ? ? ? ? ? ? ? default:'老王'//默認(rèn)值
? ? ? ? ? ? ? ? }
? ? ? ? ? ? }
備注:props是只讀的压状,Vue底層會(huì)監(jiān)測(cè)你對(duì)props的修改仆抵,如果進(jìn)行了修改,就會(huì)付出警告种冬,若業(yè)務(wù)需求確
??????????? 實(shí)修改镣丑,那么請(qǐng)復(fù)制props的內(nèi)容到data中一份,然后去修改data中的數(shù)據(jù)娱两。
?mixin(混入)
? ? 功能:可以把多個(gè)組件共用的配置取成一個(gè)混入對(duì)象
? ? 使用方式:
? ? ? ? 第一步定義混合莺匠,例如:
? ? ? ? ? {
? ? ? ? ? ? ? data(){...},
? ? ? ? ? ? ? methods:{....}
? ? ? ? ? ? ? ....
? ? ? ? ? }
? ? ? ? 第二步使用混入,例如:
? ? ? ? ? ? (1)十兢、全局混入:Vue.mixin(xxx)
? ? ? ? ? ? ?? (2)趣竣、局部混入:mixins:['xxx']
## 插件
? 功能:用于增強(qiáng)Vue
? 本質(zhì):包含install方法的一個(gè)對(duì)象摇庙,install的第一個(gè)參數(shù)事Vue,第二個(gè)以后的參數(shù)是插件使用者傳遞的數(shù)據(jù)遥缕。
? 定義插件:
? ? ? 對(duì)象.install = function(Vue,options) {
? ? ? ? ? //1卫袒、添加全局過(guò)濾器
? ? ? ? ? Vue.filter(...)
? ? ? ? ? //2、添加全局指令
? ? ? ? ? Vue.directive(...)
? ? ? ? ? //3单匣、配置全局混入(合)
? ? ? ? ? Vue.mixin(...)
? ? ? ? ? //4夕凝、添加實(shí)例方法
? ? ? ? ? Vue.prototype.$myMethod = function () {...}
? ? ? ? ? Vue.prototype.$myPrototype = xxx
? ? ? }
? ? ? 使用插件:Vue.use()
第一步:
第二步:
在main.js入口文件中使用一下插件
Vue.use(plugins)
第三步:
在組件中直接使用
scoped樣式
? ? 作用:讓樣式在局部生效,防止沖突户秤。
? ? 寫(xiě)法:<style scoped>