vue我传递一个number，结果接收的是string？

Question

自己写了个组件，传给子组件是number的，结果子组件接收到的却是string型

父组件：

<cmsProgress num=40></cmsProgress>

子组件：

<el-progress :text-inside="true" :stroke-width="20" :percentage="num" color="red"></el-progress>

export default {
    props:["num"],
    data () {
        return {
            
        }
    },
    mounted:function(){
        console.log(typeof(this.num));  //这里显示string
    }
}

这是什么原因呢？

Answer 1

这是HTML标签属性值本身就是字符串的原因。更详细的解读可以参考，传送门

因此代码应该改成下面这种：

<cmsProgress :num="40"></cmsProgress>

Answer 2

想要得到Number，可以按照 @文博 提到的:num="40"这样

其实这并不是vue的问题，而是本身在html元素的任何attributes都会被解析成string（即使你用的不是vue）。