vue父传子props，怎么设置默认值呢，我的default为什么不行？

Question

vue父传子props，怎么设置默认值呢，我的default为什么不行呢？

父组件 one

        <two :message="ac" :acacacac="aaa"></two>
        
         import two from "./two";
            
        data(){
        return{
            aaa:"",
            ac:"",
        }
    },
    components:{
        two
    },

父组件 two

    <div>
     <div>我是子组件</div>
      {{message}}
      {{acacacac}}
  </div>


 props:{
        message:{
            default:"我是默认值"
        },
        acacacac:{
            default:"我是下一个默认值"
        }
    },

为什么没有效果呢？

Answer 1

题主可以试试ac: undefined有效而aaa: ""无效，表面上看起来似乎有点智障

父组件：

 data() {
    return {
      ac: undefined,//有效
      aaa: ""//无效
    };
  }
  

子组件：

export default {
  name: "two",
  props: {
    message: {
      type: String,
      default: "我是默认值"
    },
    acacacac: {
      type: String,
      default: "我是下一个默认值"
    }
  }
};

结果：

Answer 2

两种写法。

    <div>
     <div>我是子组件</div>
      {{message}}
      {{acacacac}}
  </div>


 props:{
        message:{
            type: String,
            default:"我是默认值"
        },
        acacacac:{
            type: String,
            default:()=>{
                return '默认值'
            }
        }
    },