Vue.js フォームに入力文字数制限をかけるサンプル
環境
vue 3.0.0
node v14.15.1
yarn 1.22.4
@vue/cli 4.5.9
構文
watch: { str: function(newVal) { this.str = 処理コード } }
watchを使用して、入力値を監視して制限を行います
使用例
<template> <div class="sss"> <input type="text" v-model="str"> </div> </template> <script> export default { name: 'StudySkill', props: { msg: String }, data() { return { str: "" }; }, watch: { str: function(newVal) { this.str = newVal.length > 5 ? newVal.slice(0, -1) : newVal; } } } </script>