1.创建showCase.js文件

const ShowCase = {
    inserted(el) {
        let pHtml =
            "<p style='border-radius: 3px;z-index: 999;padding: 5px 10px;position: absolute;top: 40px;left:0;background: #667afa;color: aliceblue;min-width: 80px;line-height: 20px;'></p>";
        el.addEventListener(
            "focus",
            () => {
                el.insertAdjacentHTML("beforeend", pHtml);
                let elInput = el.getElementsByTagName("input")[0];
                // console.log(elInput.value)
                if (!elInput.value) {
                    el.getElementsByTagName("p")[0].style.display = "none";
                } else {
                    el.getElementsByTagName("p")[0].style.display = "block";
                    el.getElementsByTagName("p")[0].innerText = changeHcase(elInput.value);
                }
            },
            true
        );
        el.addEventListener(
            "click",
            () => {
                let elInput = el.getElementsByTagName("input")[0];
                if (!elInput.value) {
                    el.getElementsByTagName("p")[0].style.display = "none";
                } else {
                    el.getElementsByTagName("p")[0].style.display = "block";
                    el.getElementsByTagName("p")[0].innerText = changeHcase(elInput.value);
                }
            },
            false
        );
        el.addEventListener(
            "blur",
            () => {
                el.removeChild(el.getElementsByTagName("p")[0]);
            },
            true
        );
        el.addEventListener(
            "keyup",
            () => {
                let elInput = el.getElementsByTagName("input")[0];
                if (!elInput.value) {
                    el.getElementsByTagName("p")[0].style.display = "none";
                } else {
                    el.getElementsByTagName("p")[0].style.display = "block";
                    el.getElementsByTagName("p")[0].innerText = changeHcase(elInput.value);
                }
            },
            false
        );
    }
}
function changeHcase(n) {
    // let n = elInput.value;
    let fraction = ["角", "分"];
    let digit = [
        "零",
        "壹",
        "贰",
        "叁",
        "肆",
        "伍",
        "陆",
        "柒",
        "捌",
        "玖",
    ];
    let unit = [
        ["元", "万", "亿"],
        ["", "拾", "佰", "仟"],
    ];
    let head = n < 0 ? "欠" : "";
    n = Math.abs(n);
    let s = "";
    for (let i = 0; i < fraction.length; i++) {
        s += (
            digit[Math.floor(n * 10 * Math.pow(10, i)) % 10] + fraction[i]
        ).replace(/零./, "");
    }
    s = s || "整";
    n = Math.floor(n);
    for (let i = 0; i < unit[0].length && n > 0; i++) {
        let p = "";
        for (let j = 0; j < unit[1].length && n > 0; j++) {
            p = digit[n % 10] + unit[1][j] + p;
            n = Math.floor(n / 10);
        }
        s =
            p.replace(/(零.)*零$/, "").replace(/^$/, "零") + unit[0][i] + s;
    }
    let ret =
        head +
        s
            .replace(/(零.)*零元/, "元")
            .replace(/(零.)+/g, "零")
            .replace(/^整$/, "零元整");
    return ret;
}

export default ShowCase;
2.组件中引入
import ShowCase from "../../utils/showCase.js";
 
 directives: {
    ShowCase,
  },
 
3.组件中应用
 <el-input   v-show-cas placeholder="请输入"></el-input>
 
完事儿,全是干货~