限制 el-input 输入 emoji

这篇具有很好参考价值的文章主要介绍了限制 el-input 输入 emoji。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

1. 电脑如何输入 emoji 表情 ?

快捷键 win+; 或 win+.

2. 代码实现

<template>
  <el-input v-model="input" placeholder="请输入内容" @input="inputChange"></el-input>
</template>

<script>
export default {
  name: 'Demo',
  data () {
    return {
      input: ''
    }
  },
  methods: {
    inputChange (value) {
      this.input = value.replace(/(\ud83c[\udc00-\udfff])|(\ud83d[\udc00-\udfff])|(\ud83e[\udc00-\udfff])|[\u2100-\u32ff]|[\u0030-\u007f][\u20d0-\u20ff]|[\u0080-\u00ff]/g, '')
    }
  }
}
</script>

3. 效果图

限制 el-input 输入 emoji,elementui,vue,js,前端文章来源地址https://www.toymoban.com/news/detail-663406.html

到了这里,关于限制 el-input 输入 emoji的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • el-input限制输入整数等分析

    input 限制输入在平时的需求比较常见,例如限制输入非数字,限制输入整数,限制输入的小数位数等等。这里分析下各种实现方式。 使用 type 属性为 number :将 el-input 的 type 属性设置为 number ,这将限制用户只能输入数字。然而,这种方式仍然允许输入小数。如果你希望只接

    2024年02月05日
    浏览(53)
  • ElementUI el-input无法输入、修改、删除问题解决

    elementUI是国内前端工程师应该都听过或者使用过的前端框架, 不只使用简单,而且有着详细的文档和 API。使用 el-input 这个标签时,我有些情况下在 el-input 是无法输入的,绑定的值动也动不了,删也删不掉,改也改不了,所以我做了以下的解决方法的统计,希望可以帮助到大

    2024年02月12日
    浏览(54)
  • element--el-input限制输入为数字且必须大于0

    1. el-input限制输入为数字且必须大于0 此时只能输入大于0的正整数。 2. el-input限制输入为数字 此时只能输入大于等于0的正整数。

    2024年02月16日
    浏览(70)
  • elementui el-input输入框金额显示 千分符与输入框 金额输入框 表格或列表中的金额输入框

    1、实现思路 当用户不对输入框进行任何处理时,将数值转成千分符形式,例如 12,345.67 格式,在用户点击金额进行输入修改操作的时候,显示的数值形式12345.67,并且用户在输入过程中禁止输入中文、英文、特殊符号、英文逗号等,只能输入数字、一位小数点、小数点后2位;

    2024年02月09日
    浏览(52)
  • 【踩坑笔记】vue3 element-plus el-input 无法输入问题

    原因是 el-form 的 v-model=\\\"loginForm\\\" ref=\\\"loginForm\\\" 在vue3中值不能相同 把ref去掉或者改名即可 这是js的代码( 对象记得用reactive,不然也会无法输入 ) 这个是可以输入的 这是无法输入的 就改了个ref

    2024年02月11日
    浏览(59)
  • 关于vue的element的输入框el-input限输入只能是数字,包含小数,正数,自然数等等。

    关于element的输入框el-input限输入只能是数字,就是包括数字123456,小数的只能一个小数点,不能出现多个小数点,小数可以0开头,但是整数不能0开头,不能输入文字,不能输入负数,所以对于这个我做了两个判断,一个是正则判断,还有一个是0开头的整数判断,正则判断是只

    2024年02月12日
    浏览(56)
  • vue element-ui el-input输入框绑定@keyup.enter回车事件无效

    由于element-ui把input进行了封装,input外面是多一层div的。 在element-ui里有很多因为自身封装了几层标签导致事件和样式无法按想要的效果呈现,遇到后可以在网页中查看dom结构分析原因。 所以对于el-input,使用 @keyup.enter是无效的,需要加上 .native 限制符 .native修饰符的作用:

    2024年02月16日
    浏览(55)
  • 设置输入框el-input图标 / el-input表单只显示number

    第一种方法说明: prefix-icon图标位置在前面 suffix-icon图标位置在后面 el-icon-search 搜索小图标 el-icon-date 日期小图标 第二种方式是通过slot来插入 PS:

    2024年02月16日
    浏览(45)
  • el-input校验,只能输入正整数

    一、表单校验方式:  二、el-input的type设置为number,然后去掉上下箭头  

    2024年02月14日
    浏览(51)
  • <el-input> textarea文本域显示滚动条(超过高度就自动显示)+ <el-input >不能正常输入,输入了也不能删除的问题

    需求:首先是给定高度,输入文本框要自适应这个高度。文本超出高度就会显示滚动条否则不显示。 参考文章 问题二: 加入这个,@input=“change($event)” 参考文献 参考文献(问题更全)

    2024年02月07日
    浏览(49)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包