1、禁止用户在input框内输入空格。一开始使用的是以下这种方式，增加 pattern="^[^\s]+$"，但是不知道什么原因并不生效。（后来发现el-input组件不支持prttern属性）
<el-input
v-model="item"
placeholder="请输入"
maxlength="20"
pattern="^[^\s]+$"
></el-input>
之后采用绑定函数的方法去实现 在标签上绑定 @input="replaceStr(item)"方法,通过该方法可以实现想要达到的效果。
replaceStr(item) {
item=item.replace(/\s+/g, "");
}
2、课表的表头样式修改。时间和具体的环节中间增加换行符，无论用户到底是先输入时间还是先输入具体环节。
为了达到以上的效果，我思考的方式是识别该字符串，获得第一个数字和最后一个数字的位置，如果第一个数字的位置是0，那么证明用户先输入的是时间，那么从最后一个数字的位置开始将整串字符串截取为两段字符串，在中间增加换行符，并且在该标签增加style="white-space: pre-line;"使得换行符生效。如果第一个数字的位置不是0那么从第一个数字的位置开始截取。
<p style="white-space: pre-line;">{{ item }}</p>
获取到具体课表数据的时候进行遍历，并执行该函数 Data=this.convertFormat(Data)
convertFormat(str){
const digitRegex = /\d/; // 匹配数字的正则表达式
let firstPosition = -1;
let lastPosition = -1;
for (let i = 0; i < str.length; i++) {
if (str.charAt(i).match(digitRegex)) {
if (firstPosition === -1) {
firstPosition = i; // 找到第一个数字的位置
}
lastPosition = i; // 更新最后一个数字的位置
}
}
if(firstPosition==0){
str=str.substring(0,lastPosition+1)+ '\n' + str.substring(lastPosition+1);
console.log('str',str)
}else if(lastPosition==str.length-1){
str=str.substring(0,firstPosition)+ '\n' + str.substring(firstPosition);
}
return str
},
