在vue2.0中使用v-html渲染時(shí)有可能我門(mén)會(huì)需要微調(diào)一下樣式,今天在使用v-html時(shí)候發(fā)現(xiàn)一個(gè)問(wèn)題，渲染出來(lái)的在<style></style>中無(wú)法直接改變樣式。

tp.png

當(dāng)我們使用v-html渲染頁(yè)面，使用下面這種方式去修改樣式并沒(méi)有效果，

tp2.png

我在網(wǎng)上找了好多解決的方法

微信截圖_20190330140624.png

二.
去掉style標(biāo)簽中的scoped屬性
scoped屬性導(dǎo)致css僅對(duì)當(dāng)前組件生效（用css3的屬性選擇器+生成的隨機(jī)屬性實(shí)現(xiàn)的），而html綁定渲染出的內(nèi)容可以理解為是子組件的內(nèi)容，子組件不會(huì)被加上對(duì)應(yīng)的屬性，所以不會(huì)應(yīng)用css.
但是我使用這種方法也并沒(méi)有生效
三.
這種方法使我使用的試了下它可以生效
在updated生命周期函數(shù)中，js動(dòng)態(tài)配置樣式，代碼如下：

微信截圖_20190330140805.png

如果大家在使用前2個(gè)方法沒(méi)有生效時(shí),可以試一下第三中方法。