vue+vite+diff.js使用方法

2023-12-13 03:32:24

想实现找字符串不同的功能,找到一个diff包,功能还挺全,官方示例使用的是这样:

const Diff = require('diff');
const diff = Diff.diffChars(one, other);

但是在vue+vite中使用就不能用require。
进入diff的包找到了解决办法。(我用的是5.1.0,更早的版本不确定能不能这样用)

在vue中这样引入

import {Diff} from 'diff';

使用:

var characterDiff = new Diff();
function diffChars(oldStr, newStr, options) {
	return characterDiff.diff(oldStr, newStr, options);
}
diffChars(oriText, resText,{}).forEach(
	function(part){
		console.log(part)
		if(part.added) {
			part.value = "<span style='color:#2D93CA;font-size:16px;'>" + part.value + "</span>"
		}}
	);

其他的功能类似,要到diff包中的lib/index.mjs文件中找new Diff()前后的代码,结合/lib/diff中的相应功能代码自己进行改写。

文章来源:https://blog.csdn.net/KanShiMeKan/article/details/134878227
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。