Dva: Como limpar corretamente os dados no modelo em uma rota

Criado em 8 set. 2017 · 3Comentários · Fonte: dvajs/dva

Estou escrevendo uma página para edição de notícias agora, pois a lógica de edição e criação é a mesma, então escrevi na mesma página, mas o problema é que quando entro na lógica de edição, o modelo do editor de notícias permanecerá nos dados do modelo, quando eu entrar com a lógica de criar uma nova notícia na próxima vez, carregarei os dados do modelo residual da última vez que editei a notícia, o que afetará a página. A forma como agora limpo o modelo é para escrever um método clearModel em efeitos:

*clearModel({ payload }, { put }) {
    yield put({
        type: 'clear',
    });
},

Ao mesmo tempo, crie um novo método clear no redutor:

clear() {
    return {};
},

Em seguida, despache em componentWillUnMount do componente:

dispatch({
    type: 'model/clearModel',
    payload: {}
});

Deixe-me perguntar a vocês, há algo de errado com a minha maneira de escrever? Parece um pouco errado escrever isso.

Fonte

hanxiansen

Comentários muito úteis

O link enviado por @sorrycc ficou 404

ybning em 31 jul. 2018

👍3

Todos 3 comentários

@hanxiansen
Um método de escrita que usei antes é usar history.listen((location)) nas inscrições no modelo para julgar a rota atualmente inserida para chamar métodos diferentes. Se estiver editando, primeiro obtenha os dados do servidor e depois renderize , se for Se for criado, os dados no status atual serão apagados. (só não sei se minha própria prática é apropriada). O código é o seguinte:

..........
  state: {
    topicData: {},
    topicId: '',
  },

  subscriptions: {

    setup ({ dispatch, history }) {
      history.listen((location) => {
        const match = pathToRegexp('/topic/:id/edit').exec(location.pathname)
        if (match) {
          dispatch({
            type: 'getTopic',
            payload: { id: match[1] },
          })
        } else {
          dispatch({
            type: 'updateState',
            payload: { topicData: {}, topicId: '' },
          })
        }
      })
    },

  },

..........
  effects: {
    * getTopic ({ payload }, { call, put }) {
      const accesstoken = localStorage.getItem('accesstoken')
      let params = { accesstoken }
      params = Object.assign(params, payload)
      let data = yield call(getTopic, params)
      console.log(data)
      if (data.success) {
        data = { topicData: data.data, topicId: data.data.id }
        // yield put({
        //   type: 'setTopicId',
        //   payload: { topicId: payload.id },
        // })
        yield put({ type: 'updateState',
          payload: data,
        })
      }
    },
.......
},

  reducers: {
     ........
    updateState (state, { payload }) {
      return {
        ...state,
        ...payload,
      }
    },

  },

jdwdw em 8 set. 2017

Não há nada de errado em você fazer isso, a mudança de estado deve ir para o redutor. No entanto, se a edição e a nova lógica forem modais, os dados poderão ser deixados de fora do modelo. Consulte https://github.com/dvajs/dva/blob/master/packages/dva-example-user-dashboard/ para o método de processamento.