Vue中改變v-html渲染出來的樣式

摘要： 在vue2.0中使用v-html渲染時有可能我門會需要微調一下樣式,今天在使用v-html時候發現一個問題，渲染出來的在<style></style>中無法直接改變樣式。 tp.png 當我們使用v-html渲染頁面，使用...

在vue2.0中使用v-html渲染時有可能我門會需要微調一下樣式,今天在使用v-html時候發現一個問題，渲染出來的在<style></style>中無法直接改變樣式。

當我們使用v-html渲染頁面，使用下面這種方式去修改樣式並沒有效果，

我在網上找了好多解決的方法

一.

但是我使用這種方法並沒有生效

二.

去掉style標籤中的scoped屬性

scoped屬性導致css僅對當前元件生效（用css3的屬性選擇器+生成的隨機屬性實現的），而html繫結渲染出的內容可以理解為是子元件的內容，子元件不會被加上對應的屬性，所以不會應用css.

但是我使用這種方法也並沒有生效

三.

這種方法使我使用的試了下它可以生效

在updated生命週期函式中，js動態配置樣式，程式碼如下：

如果大家在使用前2個方法沒有生效時,可以試一下第三中方法。