@qingbing/element-highlight v1.0.4

封装 vue-element-ui 的组件

对 vue-element-ui 进行封装 代码高亮

====== 版本说明 ======

• 1.0.0 : 高亮初始化
• 1.0.1 : 高亮添加行号
• 1.0.2 : 修改高亮样式

1. 安装

npm install @qingbing/element-highlight

2. 全局引用导入，在vue的main.js中确认加入如下代码

import Highlight from "@qingbing/element-highlight";
Vue.use(Highlight);

3. vue文件中使用

3.1 静态html

<pre v-highlight><code class="language-js">var date = new Date(); </code></pre>

3.2 动态加载字段

# 定义字段
var highContent = '<php? echo 11;';

# html 标签加载
<pre v-highlight="highContent"><code></code></pre>

3.3 动态加载html字段

# 定义字段
var highContent = '<pre><code><php? echo 11;</code></pre>';

# html 标签加载
<div v-highlight v-html="highContent"></div>