ウィジェット開発におけるコンポーネント

5239 ワード

ウィジェット内のコンポーネントの作成と導入の使用
  • 作成
  • miniprogramフォルダの下にcomponentsコンポーネントフォルダを作成し、componentsフォルダを右クリック>新規Component>コンポーネント名の入力>成功
  • を作成します.
  • 導入
  • 使用するpageのjsonファイルに
  • を構成する
    {
      "usingComponents": {
        "M-music": "/components/music/musicList" //M-music         ,           
      }
    }
    
  • <M-music>M-music>
    
  • を使用
    ウィジェット内のコンポーネントの値伝達
  • コンポーネント値
  • 定義
  • <M-music playList="{{item}}">M-music>
    
  • 受付
    properties: {
        playList: {
          type: Object
        }
    }
    
  • を使用
    <view class="playList-content">
      <image src="{{playList.picUrl}}">image>
      <text>{{playList.playCount}}text>
      <view>{{playList.name}}view>
    view>
    

    ウィジェット内のコンポーネントのデータのリスニング
     observers: {
     //          playList(val),           ,        
    	 ["playList.playCount"](val) {// playList playCount      
    	  	//     ,  
    		this.setData({
    		  	_count: this._tranNumber(val, 2)
    		})
    	  }
     },
    
  • 変化を傍受後に再付与時に直接付与することはできず、デッドサイクルに陥り、dataに新たにデータを定義するには、dataに値を付与するデータ
  • .