在线翻译小程序开发之-自动识别输入文本语种

343 阅读1分钟

目前在开发利用小牛翻译API接口,开发一款在线翻译工具类小程序。
今天记录一下文本框自动识别被输入文本的语种:
前端代码:

<template>
    <view><textarea maxlength="1200" auto-height :placeholder="请输入翻译内容..." @input="getSrcText" :value="src_text" /></view>
</template>

<script>
export default {
    data() {
        return {
            src_text: ''
        };
    },
    methods: {}
};
</script>

通过 @input 监听文本框输入的文字,并判断是哪一种语种:

// 实时获取原文
getSrcText(e) {
    // console.log('getSrcText:', e.detail.value);
    let input = e.detail.value;
    if (input.match(/^[A-Za-z]+$/)) {
        //判断是否为英文字符
        console.log('当前输入为英文字符');
    } else if (input.match(/^[\u4E00-\u9FA5]+$/)) {
        //判断是否为中文字符
        console.log('当前输入为中文字符');
    } else {
        //判断是否为其他字符
        console.log('当前输入为其他字符');
    }
    this.src_text = e.detail.value;
},

完整前端+逻辑代码如下:

<template>
    <view><textarea maxlength="1200" auto-height :placeholder="请输入翻译内容..." @input="getSrcText" :value="src_text" /></view>
</template>

<script>
export default {
    data() {
        return {
            src_text: ''
        };
    },
    methods: {
        // 实时获取原文
        getSrcText(e) {
            // console.log('getSrcText:', e.detail.value);
            let input = e.detail.value;
            if (input.match(/^[A-Za-z]+$/)) {
                //判断是否为英文字符
                console.log('当前输入为英文字符');
            } else if (input.match(/^[\u4E00-\u9FA5]+$/)) {
                //判断是否为中文字符
                console.log('当前输入为中文字符');
            } else {
                //判断是否为其他字符
                console.log('当前输入为其他字符');
            }
            this.src_text = e.detail.value;
        }
    }
};
</script>

<style></style>

代码示例已上线,小程序搜索《Zirek翻译》浏览效果。