I encountered such an error when using Nuxt 3.8 :TypeError: Cannot read properties of null (reading 'shapeFlag')The error is a bit misleading to me, because I have defined a Dialog component which is also named Flag . I used Flag in two different pages, one of which was ok, but the other one threw out such an error. I tried to add ClientOnly to Flag , but the error was still there.I thought that the issue is my UI library. I am using ElementUI Plus, and my Flag component is indeed defined by wrapping ElDialog . Adding ClientOnly to ElDialog or renamed the file name of Flag to Flag.client.vue couldn't solve the error. Finally, I was able to solve this problem by using another UI library, i.e. PrimeVue.

通常情况下在使用elementUI前端框架的时候，经常会遇到表单要限制输入内容，尤其是数字。话不多说，代码如下： <el-input v-model="form.plan" type="number" step="0.5" min="0" max="5" @keyup.native="proving($event)" @input="editInput($event,'plan')" placeholder="最高5分" oninput="if(value>5)value=5;if(value<0)value=0" ></el-input>第一个属性：type=“number” input的原生属性，标明input框的类型第二个属性： step=“0.5” input的原生属性，type=“number” 时生效， 标明输入字段的合法数字间隔（假如 step=“0.5”，则合法数字应该是 -0.5、0、0.5、1，以此类推）第三个属性： min=“0” max=“5” min 属性规定输入字段所允许的最小值。 max 属性规定输入字段所允许的最大值。 min 属性与 max 属性配合使用，可创建合法值范围。第四个属性：@keyup.native="proving($event)"proving(e){ var val=e.target.value; //限制只能输入一个小数点 if (val.indexOf(".") != -1) { var str = val.substr(val.indexOf(".") + 1); if (str.indexOf(".") != -1) { val = val.substr(0, val.indexOf(".") + str.indexOf(".") + 1); } } e.target.value = val.replace(/[^\d^\.]+/g,''); },第五个属性：@input="editInput($event,‘plan’)"editInput(value, name) { this.form[name] = ("" + value) // 第一步：转成字符串 .replace(/[^\d^\.]+/g, "") // 第二步：把不是数字，不是小数点的过滤掉 .replace(/^0+(\d)/, "$1") // 第三步：第一位0开头，0后面为数字，则过滤掉，取后面的数字 .replace(/^\./, "0.") // 第四步：如果输入的第一位为小数点，则替换成 0. 实现自动补全 .match(/^\d*(\.?\d{0,1})/g)[0] || ""; // 第五步：最终匹配得到结果 以数字开头，只有一个小数点，而且小数点后面只能有0到2位小数 },第六个属性： placeholder=“最高5分” 提示内容第七个属性：οninput="if(value>5)value=5;if(value<0)value=0"表示：如果输入内容大于5 ，就输出5 ，如果输入内容小于0 输出0elementUI中el-input输入数字且保留指定小数位<!-- 如果需要保留两位小数或者三位小数 只需要将 最后的 +2 改为 +3 即可 以此类推，保留几位小数就 几+1 --> <el-input type="text" placeholder="请输入保留一位小数的数字" v-model="userValue" oninput="if(isNaN(value)) { value = parseFloat(value) } if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+2)}" />因项目需要在此记录下此文章是我开发过程的一个记录，方便我日后学习和复盘。若能帮到你不胜荣幸。原文链接：https://blog.csdn.net/weixin_44835297/article/details/111253150