手动设置的el-radio-group默认值无效？选Number()还是parseInt()？

问题来源

在使用el-radio-group处理勾选值的时候，设置好的v-model="groupitemselected"无效！

##组件使用##
<el-radio-group v-model="groupitemselected">
  <el-radio
      v-for="item in  allInfoType"
      size="small"
      :label="item.id"
      :key="item.id"
      style="margin-top: 10px">
    {{ item.name }}
  </el-radio>
</el-radio-group>

##设置默认值##
this.groupitemselected = this.parentid;

##控制台输出结果##

console.log(' this.parentid', this.parentid);

console.log(' this.groupitemselected', this.groupitemselected);

this.parentid 3

this.groupitemselected 3

明明设置成功了为什么无效果呢？？？

解决办法 

思考：会不会受数据类型影响呢？

尝试打印类型

console.log('this.parentid type:', typeof this.parentid);
console.log('this.groupitemselected type:', typeof this.groupitemselected);
 

##结果##

this.parentid type: string

this.groupitemselected type: string

发现 this.groupitemselected类型是字符串而<el-radio>的:label="item.id"类型是number

尝试将this.groupitemselected类型转换成number，结果默认值成功勾选！

this.groupitemselected = parseInt(this.parentid);

##类型结果##

this.groupitemselected type: number

 至此问题解决

可以用Number()吗？

答案是：可以，通常情况下groupitemselected参数都是纯数字，用Number()和parseInt()影响不大，如果包含其他字符就需要根据情况去考虑了！

• parseInt():

  • parseInt() 函数将字符串转换为整数（整型数字）。
  • 它从字符串的开头开始解析，直到遇到第一个非数字字符为止，然后返回解析到的数字部分。
  • 如果字符串以非数字字符开头，则返回 NaN（Not-a-Number）。
  • 可以通过第二个参数指定进制（基数），默认为十进制。例如，parseInt("10", 2) 将返回二进制字符串 "10" 对应的十进制整数 2。

• Number():

  • Number() 构造函数将字符串转换为数字。
  • 如果字符串包含有效的数字形式（整数、浮点数），则返回对应的数字。
  • 如果字符串包含非数字字符，或者是空字符串，则返回 NaN。
  • 与 parseInt() 不同，Number() 不支持指定进制，它始终将字符串解析为十进制数。