まず、暗黙のルールとして知っておくべきことは、イベントをコンポーネントに書き込むのではなく、ページにイベントを書き込むことです。
1. 親から子への受け渡し (ページがコンポーネントにパラメーターを渡します)
1.wxml ページ:
/* 引用组件 */
<toast list='{
{list}}'></toast>
最初のリストはパラメータを受け取るコンポーネントで、2 番目のリストは渡す値です。
2. サブコンポーネントは以下を受け取ります。
/**
* 组件的属性列表
*/
properties: {
list: {
type: Object,
value: {}
}
},
type はパラメータのタイプです。例: (arrary、number、string、function、object) 値がない場合、値は空です。
2. 子から親への受け渡し (コンポーネントはページにパラメータを渡します)
1. サブコンポーネント:
<view class="btn-confirm" bindtap="onConfirm" data-index="{
{list.index}}">{
{list.confirmText}}</view>
/**
* 子组件向父组件传值
*/
onConfirm: function (e) {
const index = e.currentTarget.dataset.index
// confirm为父组件接收的事件名
this.triggerEvent('confirm', {index})
}
2. ページは、コンポーネントによって渡された値を受け取ります。
// bind:confirm bind后面必须跟组件那边起的名称
<toast list='{
{list}}' bind:confirm='confirm'></toast>
js:
// 接收子组件传递过来的参数
confirm(e) {
// 打印传的值
console.log(e.detail)
},
3. 失敗した場合
1.ページのJSON参照コンポーネントのパスが正しいかどうかを確認します
{
"usingComponents": {
"toast": "/components/toast/index",
}
}
2. jsonのコンポーネントがtrueかどうかを確認する
{
"component": true
}