2 min read 前端

在Taro2工程中使用DVA

本文是关于Ts版的Taro 2工程如何引入Dva 2。整体思路就是先安装默认脚手架工程，然后安装dva相关依赖及其他依赖，然后编写相关代码，引入dva。

在Taro2工程中使用DVA

操作步骤

  1. 创建官方脚手架工程，本文选的默认，没有选redux；

  2. 安装DVA相关依赖：

npm i redux @tarojs/redux @tarojs/redux-h5 redux-logger redux-thunk dva-core dva-loading
  1. 安装其他依赖：
npm i
  1. 在src/app.tsx同级增加dva.ts：
import Taro from '@tarojs/taro'
import { create } from 'dva-core'
// import { createLogger } from 'redux-logger'
import createLoading from 'dva-loading'

let app, store, dispatch, registered

function createApp(options?: any) {
  const { models } = options
  // if (process.env.NODE_ENV === 'development') {
  //   options.onAction = [createLogger()]
  // }
  app = create({
    ...options
  })
  app.use(createLoading({}))

  // 适配支付宝小程序
  if (Taro.getEnv() === Taro.ENV_TYPE.ALIPAY) {
    global = {};
  }

  if (!global.registered) models.forEach((model) => app.model(model))
  global.registered = true
  app.start()

  store = app._store
  app.getStore = () => store
  
  dispatch = store.dispatch
  app.dispatch = dispatch

  global.store = store

  return app
}

export default {
  createApp,
  getDispatch() {
    return app.dispatch
  }
}
  1. 在src/pages/index目录下，创建model.ts：
export interface HomeModelState {
}

const HomeModel = {
  namespace: 'home',
  state: {
  },
  effects: {
  },
  reducers: {
    save(state, { payload }) {
      return {
        ...state,
        ...payload,
      }
    }
  },
}

export default HomeModel
  1. 在src目录下建立models目录，并创建index.ts：
import home from '../pages/index/model'

export default [
  home,
]

建议在src/models下放公用的model文件，其他分别放在页面目录，并在这个入口文件index.ts里导入进来。

  1. 修改src目录下的app.tsx：
import { Provider } from '@tarojs/redux'
import dva from './dva'
import models from './models/index'


const dvaApp = dva.createApp({
  initialState: {},
  models: models
});
const store = dvaApp.getStore();

上面是要增加的代码；

...

  render () {
    return (
      <Provider store={store}>
        <Index />
      </Provider>
    )
  }

...

如上，就在render里的<Index />外包裹Provider就好。

自此，Taro 2的工程引入Dva完成。
本文适用于Taro 1.x.x 和 2.x.x，亲测没问题。

Read more

Mac M1安装arm版homebrew和nvm和nodejs

Mac M1安装arm版homebrew和nvm和nodejs

Mac M1以及更新款ARM架构的电脑，安装homebrew、nvm、nodejs简单的方法小记。 1. 安装homebrew /bin/bash -c "$(curl -fsSL https://gitee.com/ineo6/homebrew-install/raw/master/install.sh)" 然后会提示下一步，要在终端执行以下命令： echo 'eval "$(/opt/homebrew/bin/brew shellenv)"' >> /Users/你的用户名/.zprofile eval "$(/opt/homebrew/bin/brew shellenv)" 执行后，就可以顺利安装成功。 2. 安装nvm brew install nvm 下载完nvm基本上就能顺利安装好了，然后会显示一大段提示内容； export