vue 通过v-html动态渲染的html元素 设置样式问题 $nextTick

例如，我们从后端接口中获取来这么一大串html代码需要填充至我们页面当中去

image.png

通过v-html设置上去后，我们在style里面设置样式是设置不上去的
这个时候就要用到$nextTick,通过js来设置样式

<p v-html="text" class="text" id="text"></p>

              if(res.data.code == 200) {
                    console.log(res)
                    let dataList = res.data.data.content
                    let text = document.getElementById('text')
                    for(let i = 0; i < dataList.length;i++) {
                        for(let j = 0; j < dataList[i].length;j++) {
                            this.text = dataList[i][0].post_content
                            this.$nextTick(function () {
                                for(let i = 0;i < text.children.length;i++) {
                                    text.children[i].style.marginBottom = '20px'
                                    text.children[i].children[0].style.fontSize = '12px'
                                    text.children[i].children[0].style.lineHeight = '20px'
                                    text.children[i].children[0].style.color = '#666666'
                                    text.children[i].children[0].style.width = '100%'
                                    if(text.children[2].children[0].nodeName == 'IMG') {
                                        text.children[i].style.textIndent = 0
                                    } else {
                                        text.children[i].style.textIndent = '2em'
                                    }
                                }
                            })
                        }
                    }
                }