Q: 为什么子组件的属性写了默认值，但是不显示

**A:**父组件给组件的此属性传了值

**W:**无论父组件传给子组件的属性是否为空，都会替换子组件的属性设置的默认值

CODE

子组件

Label.wxml

1
2
3
4
5
6
7
8
Component({
  properties: {
    title: {
      type: String,
      value: '子组件标题'
    }
  }
})

Label.wxml

1
<text>{{title}}</text>

父页面

index.wxml

1
<label title="{{title}}"></label>

index.json

1
2
3
4
5
{
  "usingComponents": {
    "label": "./components/label/label"
  }
}

index.js

1
2
3
4
5
Page({
  data: {
    title: '父页面标题'
  }
})

此时页面会显示【父页面标题】

显示父组件传入的值

1
2
3
4
5
Page({
  data: {
    title: ''
  }
})

此时页面不会显示文字

父页面传值为空，不显示子组件属性默认值

需要页面显示子组件的默认值，需要

1
<label></label>

此时会显示子组件title属性的默认值

父页面不传属性，才会显示子组件给属性设置的默认值

最后更新： 2021年12月01日 10:33