Dva: Problemas com React Hooks e dva

useDispatch, depois de usar hooks, você não precisa se conectar, mas para ficar com preguiça, tirei todos os efeitos e redutores da loja, pesquisei no namespace e retornei todas as ações, consulte:

function useActions(namespace) {
  const dispatch = useDispatch();

  const actions = useMemo(() => {
    const { _models } = getStore();
    const targetModel = _models.find(model => model.namespace === namespace);
    return targetModel ? Object.keys({ ...targetModel.effects, ...targetModel.reducers }).reduce((prev, curre) => {
      const actionName = curre.replace(new RegExp(`^${namespace}/`), '');
      prev[actionName] = payload => dispatch({ type: curre, payload });
      return prev;
    }, {}) : {};
  }, [namespace, dispatch]);

  return actions;
}

useDispatch, depois de usar hooks, você não precisa se conectar, mas para ficar com preguiça, tirei todos os efeitos e redutores da loja, pesquisei no namespace e retornei todas as ações, consulte:

function useActions(namespace) {
  const dispatch = useDispatch();

  const actions = useMemo(() => {
    const { _models } = getStore();
    const targetModel = _models.find(model => model.namespace === namespace);
    return targetModel ? Object.keys({ ...targetModel.effects, ...targetModel.reducers }).reduce((prev, curre) => {
      const actionName = curre.replace(new RegExp(`^${namespace}/`), '');
      prev[actionName] = payload => dispatch({ type: curre, payload });
      return prev;
    }, {}) : {};
  }, [namespace, dispatch]);

  return actions;
}

Os oficiais parecem ter removido o uso de useDispatch().
Agora
use desta forma

Onde o @UlyC é removido, você pode fornecer um link?

Onde o @UlyC é removido, você pode fornecer um link?

Eu estava errado.
Não há uso de useDispatch() na API oficial do React Hooks em https://reactjs.org/docs/hooks-reference.html ,
Este é o uso de react-redux https://react-redux.js.org/next/api/hooks#useddispatch , para importar do react-redux
import { useDispatch } from 'react-redux'

Onde o @UlyC é removido, você pode fornecer um link?

Eu estava errado.
Não há uso de useDispatch() na API oficial do React Hooks em https://reactjs.org/docs/hooks-reference.html ,
Este é o uso de react-redux https://react-redux.js.org/next/api/hooks#useddispatch , para importar do react-redux
import { useDispatch } from 'react-redux'

= - bem

~ const dispatch = useDispatch(); ganchos Não dva faz promessa? ~
O efeito é adicionado ao Promise em dva

O dva/umi considerou a integração de ganchos? Se você quiser usá-lo, você tem que usar import { useDispatch } from 'react-redux' assim. Haverá buracos.

Eu usei, sem problemas

@yoyo837
````
import { useDispatch } de 'dva';

console.log('6:23:08 PM', useDispatch)
````
Eu imprimo indefinido assim. Devo atualizar o react-redux?para qual versão?

atualizar dva mais recente beta

é melhor você assistir os lançamentos

Espero atualizar o documento após a atualização. Não descobri o que a função useDispatch está fazendo.

dva é derivado diretamente de react-redux useDispatch , você pode apenas olhar para o documento react-redux

https://react-redux.js.org/api/hooks#useddispatch

https://www.npmjs.com/package/dva-react-hook

1. Atualize o dva para a versão mais recente (minha versão é 2.6.0-beta.12)
2.

Endereço de referência: https://react-redux.js.org/api/hooks
espero ser útil

Antd Pro V4 é atualizado para 2.6beta 12 e pode ser usado normalmente, mas o tipo de relatório de conexão está errado.A seguir está a mensagem de erro do TableList, como corrigir?

作为表达式调用时，无法解析类修饰器的签名。
  不能将类型“ConnectedComponentClass<typeof TableList, Pick<TableListProps, "form" | "wrappedComponentRef">>”分配给类型“typeof TableList”。
    Type 'Component<Pick<TableListProps, "form" | "wrappedComponentRef">, any, any>' is missing the following properties from type 'TableList': columns, handleStandardTableChange, handleFormReset, toggleForm, and 10 more.

@wangzhipeng404 Use ganchos e não há necessidade de conectar componentes

Mas o layout e o bloco do framework pro usam conect, eu mesmo tenho que alterá-los, existe alguma maneira de corrigir rapidamente esses tipos de erros

Eu escrevi um caso de teste simples, o código a seguir é escrito da maneira normal e pode ser usado normalmente

import React, { Component } from 'react';
import { connect } from 'dva';
import ProductList from '../components/ProductList';

@connect(({ products }) => ({
  products,
}))
export default class Products extends Component {
  componentDidMount() {
    const { dispatch } = this.props;
    dispatch({
      type: 'products/fetch',
    });
  }
  handleDelete = id => {
    const { dispatch } = this.props;
    dispatch({
      type: 'products/delete',
      payload: id,
    });
  };
  render() {
    const { products } = this.props;
    return (
      <div>
        <h2>List of Products</h2>
        <ProductList onDelete={this.handleDelete} products={products} />
      </div>
    );
  }
}

Mais tarde, consultei https://react-redux.js.org/next/api/hooks e queria reescrevê-lo em ganchos

import React, { useEffect } from 'react';
// import { connect } from 'dva';
import ProductList from '../components/ProductList';
import { useSelector, useDispatch } from 'react-redux';

// https://react-redux.js.org/next/api/hooks

export default function Products() {
  console.info(`useDispatch: `,useDispatch)
  const dispatch = useDispatch();
  const products = useSelector(state => state.products);
  useEffect(() => {
    dispatch({
      type: 'products/fetch',
    });
  });
  const handleDelete = id => {
    dispatch({
      type: 'products/delete',
      payload: id,
    });
  };
  return (
    <div>
      <h2>List of Products</h2>
      <ProductList onDelete={handleDelete} products={products} />
    </div>
  );
}

Mas desta vez dá um erro

Espero fortemente apoiar ganchos

@liudonghua123 pergunta desta vez tão rápido quanto dar uma olhada no código-fonte do dva.Seu código abaixo não usa dva e não atende conforme exigido pelo react-redux, Use dva para fazer isso por você, é estranho se você puder usá-lo.

@liudonghua123 O chamado exemplo utilizável acima é impossível de usar sem carregar a inicialização do dva, e o dva apenas exporta diretamente o connect, useSelector e outros métodos de react-redux.

@yoyo837 O código que posso usar normalmente acima faz parte do código, a parte de inicialização do dva está em outro lugar, não escrevi tudo aqui, o código está escrito com referência a https://dvajs.com/guide/getting- begin.html , acabei de enviar para o github, https://github.com/liudonghua123/dva-quickstart/blob/hooks/src/routes/Products.js , o branch hooks é problemático, o branch master pode ser usado normalmente

Tentei a atualização de dva para 2.6.0-beta.14 como mencionado acima, o código pode ser usado normalmente sem modificação, mas para unificação, useSelector , useDispatch mudou de dva exportação é um pouco melhor todas as modificações são
https://github.com/liudonghua123/dva-quickstart/commit/f9bd1dd1332e62739d15050c4d50bc069a7fb58f

Mas o layout e o bloco do framework pro usam conect, eu mesmo tenho que alterá-los, existe alguma maneira de corrigir rapidamente esses tipos de erros

Olá, você já resolveu este problema?A versão dva_beta usada no antd-pro-ts parece relatar um erro

could not find react-redux context value; please ensure the component is wrapped in a <Provider>

Parece que um monte de coisas está embalado dentro

@liudonghua123 O chamado exemplo utilizável acima é impossível de usar sem carregar a inicialização do dva, e o dva apenas exporta diretamente o connect, useSelector e outros métodos de react-redux.

Faz sentido, realmente não parece ser capaz de misturar, não é o mesmo princípio

Antd Pro V4 é atualizado para 2.6beta 12 e pode ser usado normalmente, mas o tipo de relatório de conexão está errado.A seguir está a mensagem de erro do TableList, como corrigir?

作为表达式调用时，无法解析类修饰器的签名。
  不能将类型“ConnectedComponentClass<typeof TableList, Pick<TableListProps, "form" | "wrappedComponentRef">>”分配给类型“typeof TableList”。
    Type 'Component<Pick<TableListProps, "form" | "wrappedComponentRef">, any, any>' is missing the following properties from type 'TableList': columns, handleStandardTableChange, handleFormReset, toggleForm, and 10 more.

Também estou com esse problema, você conseguiu resolver?

Com hook, você não precisa usar connect novamente.

Com hook, você não precisa usar connect novamente.

Bem, mas o projeto foi escrito com componentes de classe antes, e a carga de trabalho de refatoração com ganchos é um pouco pesada, e esse tipo de aviso parece muito chato

Este problema foi marcado automaticamente como obsoleto porque não teve atividade recente. Será fechado se não ocorrer mais nenhuma atividade. Obrigado por suas contribuições.

https://github.com/dvajs/dva/issues/2140#issuecomment -507620628 Feliz em ouvir