代码比对展示(Code comparison display)
npm install vue-code-diff> 代码比对展示 demo
shell
yarn add vue-code-diff
`使用
`vue
import CodeDiff from 'vue-code-diff'
export default {
components: {CodeDiff},
data(){
return {
oldStr: 'old code',
newStr: 'new code'
}
}
}
``| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---------- |-------- |---------- |------------- |-------- |
| old-string| 陈旧的字符串| string | — | — |
| new-string| 新的字符串| string | — | — |
| context| 不同地方上下间隔多少行不隐藏 | number | — | — |
| outputFormat| 展示的方式 | string | line-by-line,side-by-side | line-by-line |
| drawFileList | 展示对比文件列表 | boolean | - | false |
| renderNothingWhenEmpty | 当无对比时不渲染 | boolean | - | false |
| diffStyle | 每行中对比差异级别 | string | word, char | word |
| fileName | 文件名 | string | - | |
| isShowNoChange | 当无对比时展示源代码 | boolean | - | false |