ウィジェットカスタムコンポーネントの使用


コンポーネントの導入
親コンポーネントは直接サブコンポーネントにパラメータを追加し、値を伝えます.サブコンポーネントは直接受け入れることができます.
受信した値は、dataに入れる必要がなく、ページに直接レンダリングできます.

jsonファイル構成コンポーネント
{
  "usingComponents": {
     "orderBar":"/components/orderBar/orderBar"
  },
  "navigationBarTitleText": "  "
}

                            
jsファイル、
親コンポーネントはイベントをカスタマイズし、子コンポーネントはイベントをトリガーして親コンポーネントにパラメータを渡すことができます.

  orderBarEvent(data){
    console.log(data.detail.id)
    let index = data.detail.id;
    var tabs = this.data.orderBar;
    //     
    tabs.forEach((item, idx) => {
      index == idx ? item.active = true : item.active = false;
    })

    this.setData({
      orderBar: tabs
    })

    //      id           
  },

             
1子コンポーネントが親コンポーネントをトリガーするイベント
2 properties jでパラメータを受け入れる
 
   
 properties: {
     orderBar:{
       type:Array,
 //   
       value:[]
     }

  },

  /**
   *        
   */
  data: {
    
  },


  methods: {
    tapItem(e){
      //   id
      var index = e.currentTarget.dataset.id;
      //      ,    ,      
      // id     item   ,      。
      this.triggerEvent("myEvent",{id:index})
    

    }