首先在mount里调用init方法,同时注册init监听函数,注册update监听函数。
init方法,设置contents和offset初始值,根据autoresize值,监听el元素注册update回调。调用update方法来更新文件内容。
update方法,设置text文本内容,调用search方法设置文本截断offset的位置。
getLines方法,调用getClientRects获取当前文字内容的行数,获取文本区域:当目标为行内元素,返回每行内容相对浏览器窗口左上角的位置。
isOverflow方法,根据maxLines,getLines(),scrollHeight来判断是否溢出。
updated生命周期函数,更新text文本内容,设置el元素的内容。
localExpanded,控制展开折叠,调用clampAt和update更新文字截断offset的位置。
clampAt方法设置offset位置,调用applyChange更新文件内容。
applyChange方法,设置el元素的textContent内容。
clampedText,渲染实际内容,根据this.offset文字截断位置来截取文字内容
search方法,核心,根据二分法,递归的将文字内容划分,找到文本截断offset的位置。每次得到to和from的坐标,计算出中间位置target,然后调用clampAt方法,设置offset,同时调用applyChange更新文本内容,然后递归调用search方法对内容长度进行二分,二分法逻辑是获取中间位置,将每次二分后的内容渲染出来,通过getLines来判断是否溢出,不溢出则取[target,to]的位置进行下一次递归,溢出说明文字内容长度过长,则取[from, target]的位置进行下一次递归,递归条件是to-from的坐标差值小于 3个字符则找到文字截断位置,调用stepToFit方法进行offset设置。
stepToFit方法,当to与from坐标差值小于3时设置,调用fill方法进行offset偏移距离计算,调用clamp找到当前行的截断位置。
fill方法,根据循环条件,将offset坐标右移。
循环条件如下:文本未超过最大行数溢出或者当前行数小于2并且当前offset位置小于文字长度。
clamp方法,根据循环条件,将offset坐标左移。
循环条件如下:文本超过最大行数溢出时并且当前行数大于1并且offset大于0。
realText,根据展开折叠状态,控制文本内容。