mobx wxapp ดาวน์โหลด - mobx wxapp ดาวน์โหลดซอร์สโค้ด

mobx wxapp

โค้ดแหล่งที่มา AI

1.0.0

ดาวน์โหลด

mobx-wxapp

เมื่อใช้ mobx ในมินิโปรแกรม ฟังก์ชัน connect สามารถผูกข้อมูลที่สังเกตเข้ากับมุมมองมินิโปรแกรมได้อย่างมีประสิทธิภาพ ดู v1 สำหรับวิธี inject แบบเก่า

ติดตั้ง

npm install mobx-wxapp จะติดตั้งโปรเจ็กต์ในเครื่องหรือคัดลอกไฟล์โดยตรง (ตัวอย่าง/mobx-wxapp.js) ไปยังโปรเจ็กต์ของคุณ

(เคสนี้ใช้ mobx.js v4.6.0 เนื่องจาก mobx5 ใช้พร็อกซี ES6 ซึ่งมินิโปรแกรมไม่รองรับในปัจจุบัน)

การใช้งาน

หน้า/index.js:

 import { connect , extract } from '../mobx-wxapp'
import { observable } from '../mobx'

const appStore = observable ( {
  title : 'mobx-wxapp'
} )

const store = observable ( {

  // observable
  seconds : 0 ,

  // computed
  get color ( ) {
    return this . seconds % 2 ? 'red' : 'green'
  } ,

  // actions
  tick ( ) {
    this . seconds += 1
  }
} )

// page
Page ( {
  onLoad ( ) {
    connect ( this , ( ) => ( {
        title : appStore . title ,
        color : store . color ,
        seconds : store . seconds
        // 或者使用 extract 一次性提取全部属性
        // ...extract(store)
      } )
    )
  } ,
  add ( ) {
    store . tick ( )
  }
} )

หน้า/index.wxml:

< view >{{ title }} :</ view >
< view style = " color:{{ color }} " > seconds:{{ seconds }} </ view >
< button bindtap = " add " >add</ button >

แน่นอน คุณสามารถใช้มันใน Component ได้:

 Component ( {
  //..
  ready ( ) {
    this . disposer = connect ( this , mapDataToStore , options )
  } ,

  //请务必在组件生命周期结束前执行销毁器!
  detached ( ) {
    this . disposer ( ) ;
  }
  //...
} )

เอพีไอ

เชื่อมต่อ (บริบท, mapDataToStore, ตัวเลือก?)

context:Object // กรุณาส่งผ่านในนี้
mapDataToStore:Function //ฟังก์ชันการแมปที่ต้องเชื่อมโยงกับมุมมอง
ตัวเลือก:วัตถุ // พารามิเตอร์ทางเลือก

 options = {
  delay:Number,// setData的最小执行间隔,默认30ms
  setDataCallback:Function // setData的执行回调
}

ค่าที่ส่งคืน: connect ส่งคืนฟังก์ชันตัวทำลาย (เมื่อใช้ในเพจ มันจะถูกดำเนินการโดยอัตโนมัติในวงจรชีวิต onUnload แต่เมื่อใช้ในตัวสร้างคอมโพเนนต์ โปรดแน่ใจว่าได้เรียกใช้ฟังก์ชันนี้ด้วยตนเองเมื่อสิ้นสุดวงจรชีวิต)