HUI

# Textdiff 文本对比

TIP

此组件只在v1.0.12或以上版本有效

# Textdiff 概述

对传入的两个文本进行对比分析,并将不同进行标注

# Textdiff 代码演示

# 基本用法

左右传入对比文本,可进行行对比,并对不同文本进行颜色标注
行选中时当前行背景色置为淡黄色,同时将置为底部对应的行内

# 颜色设置及事件、

可以对不同文本及多余文本进行不同颜色标识
左右行选中时可以触发 on-left-select 事件或者 on-right-select 事件

# Textdiff API

# Textdiff props

属性 说明 类型 默认值
leftValue 左侧传入值 String -
rightValue 右侧传入值 String -
leftTitle 左侧标题 String -
rightTitle 右侧标题 String -
diffColor 左右对比不同时文本颜色 String red
moreColor 左右对比多余行文本颜色 String blue
isShowTitle 是否显示 title Boolean true
isShowSelect 是否显示 select Boolean true
diffBgColor 文本对比不同时的背景颜色值(此属性只在1.0.21或以上版本有效) String -
height 文本对比内容高度设置(此属性只在1.0.21或以上版本有效) String || Number -

# Textdiff events

事件名 说明 返回值
on-left-select 左侧行选中时触发 当前行内容(去除空格)
on-right-select 右侧行选中时触发 当前行内容(去除空格)

# Textdiff methods

方法名 说明 返回值
diff 手动触发对比,this.$refs.XXX.diff({left: ***, right: ***}) -