站长

之前只是单纯的会用，因为vue关于父子组件通讯差别有一点点大。1.在父组件内传递变量的时候，需要加冒号<code>:</code>，否则你就只是单纯的传递了一个字符串而已。<img src="https://img.blogweb.cn/article/47e2857ba7c24ccb8db91978777543ad.webp" loading="lazy" alt="关于Vue3的defineProps用法">2.在子组件里不需要引入<code>defineProps</code>就可调用该函数去接收父组件传来的属性。<img src="https://img.blogweb.cn/article/a2e06a31a87f44789f7af7124364f6ae.webp" loading="lazy" alt="关于Vue3的defineProps用法">我个人在这里给自己提醒⏰，可能我太迷糊了。这里需要注意！！这是<code>defineProps</code>API是一个函数，它的返回值就是父亲传来的属性。<img src="https://img.blogweb.cn/article/d974ff8d04534c1b9bcc2de9b98fa696.webp" loading="lazy" alt="关于Vue3的defineProps用法">3.刚开始让我感到奇怪的是，我好像不用变量去接收，在<code>template</code>里也能正常使用。那我还用变量接收干啥呢？这个API的返回值有毛线用啊？<img src="https://img.blogweb.cn/article/c240c7294b004eabb418a18a57395500.webp" loading="lazy" alt="关于Vue3的defineProps用法"><img src="https://img.blogweb.cn/article/96e2ca9d02514c71a8d15aef1238ecec.webp" loading="lazy" alt="关于Vue3的defineProps用法">也不用像React那样变量前面都得加一个<code>props.</code>才可以访问，也没有结构去拿。这么方便吗？4.恍然大悟原来在<code>script</code>标签里直接拿属性用是拿不到的......<img src="https://img.blogweb.cn/article/2fb602b8f2ad4591996adcd326bdea08.webp" loading="lazy" alt="关于Vue3的defineProps用法"><img src="https://img.blogweb.cn/article/5210bdf3dec74aa98e3d08cac91811b0.webp" loading="lazy" alt="关于Vue3的defineProps用法">这里变量名不一定非得是<code>props</code>，js可并没有规定不允许汉字作为变量名哦<img src="https://img.blogweb.cn/article/d6936d4c9b2946e18e8a9c670f33bd3d.webp" loading="lazy" alt="关于Vue3的defineProps用法"><hr>下次聊聊<code>defineEmits</code>，主要react的一些思想还没完全转变到vue上，还需努力！

之前只是单纯的会用，因为vue关于父子组件通讯差别有一点点大。1.在父组件内传递变量的时候，需要加冒号，否则你就只是单纯的传递了一个字符串而已。2.在子组件里不需要引入就可调用该函数去接收父组件传来的属性。我个人在这里给自己提醒⏰，可能我太迷糊了。这里需要注意！！这是API是一个函数，它的返回值就是父亲传来的属性。3.刚开始让我感到奇怪的是，我好像不用变量去接收，在里也能正常使用。那我还用变量接收