0

代码如下:

<no-ssr placeholder="加载中" v-highlight>
      <pre>{{mycode}}<code style="atom-one-dark" :class="myCodeClass">{{mycode}}</code></pre>
    </no-ssr>
const hljs = require('highlight.js');

    Vue.directive('highlight', {

        

        inserted: el => {

            let blocks = el.querySelectorAll('pre code');

            blocks.forEach( (block) => {
                hljs.highlightBlock(block);
            });

            console.log('test1');

        },

        componentUpdated: el => {

            let blocks = el.querySelectorAll('pre code');

            blocks.forEach( (block) => {
                hljs.highlightBlock(block);
            });

            console.log('test22', blocks);

        },

    });

当mycode这个变量更新的时候,html里面的{{mycode}}是实时更新的。但是highlightjs显示的代码依然还是旧的代码,如何解决呢?

Milu 1.2k
2018-07-12 提问

1 个回答

0

已采纳

自己解决了。
我发现人家已经写好了插件了。具体可以看人家的源码实现:
https://github.com/metachris/...

你可能感兴趣的

推广链接