mobx部分observer, inject学习记录

//app.jsx
const store = {
  counterStore,
  testStore
}
render () {
    return (
      
        
      
    )
  }

注：今日测试taro中的app文件写标签是不生效的，也可能下次测试就可以生效，滑稽脸

//store/counter.js
import { observable } from 'mobx'

const counterStore = observable({
  counter: 0,
  brr:'brr',
  counterStore() {
    this.counter++
  },
  increment() {
    this.counter++
  },
  decrement() {
    this.counter--
  },
  incrementAsync() {
    setTimeout(() => {
      this.counter++
    }, 3000)
  }
})
export default counterStore

在组件使用中注意一定要引用，
目前测试发现假设在counter文件写曝光两个store，第二个不生效，唯一想到的方法是新建一个js文件，重新引用。
还有，一个组件是可以使用两个stoer中的内容，但前提是你需要在app.js
中引用，
在组件使用@inject是可以这样一次引用两个store的

@inject('counterStore','testStore')

@inject('counterStore')
@inject('testStore')

//pages/index/index.jsx
import Taro, { Component} from '@tarojs/taro'
import { View, Button, Text } from '@tarojs/components'
import { observer, inject } from '@tarojs/mobx'

import './index.scss'
import Example from '../index/component/example/example'
import Example2 from '../index/component/example2/example2'


@inject('counterStore','testStore')
// @inject('testStore')
@observer
class Index extends Component {
  config = {
    navigationBarTitleText: '首页'
  }

  increment = () => {
    const { counterStore } = this.props
    counterStore.increment()
  }

  decrement = () => {
    const { counterStore } = this.props
    counterStore.decrement()
  }

  incrementAsync = () => {
    const { counterStore } = this.props
    counterStore.incrementAsync()
  }
  getTestStore=()=>{
    const {testStore} = this.props
    // testStore.arr
    console.log(testStore.arrHandle)
  }
  render () {
    const { counterStore: { counter}} = this.props
    return (
      

        +
        -
        三秒后+1
        {counter}
      
    )
  }
  componentDidMount () {
    console.log(this.props.testStore.brr)
   }
export default Index 

2020.4.20施工完毕