Я только начал связываться с два, и я действительно не знаю, как реализовать события жизненного цикла, которые я делал в два. Вы можете привести пример?
Вдобавок, если функция компонента в компонентах будет изменена на extends React.Component, каков будет эффект?
Если функция компонента в компонентах будет изменена на extends React.Component, каков будет эффект?
Нет эффекта. По-прежнему пишите по предыдущей привычке, а затем добавляйте два в слой данных.
Потом добавить два в слой данных ??? Как присоединиться?
Я только вчера вечером разобрался, как начать работу с два + и Мобайл,
Следуйте https://github.com/sorrycc/blog/issues/18 этому руководству, чтобы пройти и попытаться понять его.
Не пошел, перечитал, тоже искал какую-то информацию.Главная проблема - понимание redux.
Можете ли вы дать мне конкретные указатели относительно позиции записи componentWillMount () и componentDidMount ()?
Записан ли componentWillMount () в ловушку маршрутизации?
Записывает ли componentDidMount () внешние компоненты?
Тот же вопрос
@xttianma @CodeSuPrMan изменил Component без сохранения состояния на React.Component
См. Https://facebook.github.io/react/docs/components-and-props.html.
Вы можете посмотреть на перекомпоновку
Ник Чжэн
Мобильный: +86118918960666 (Китай)
weChat: nick_zheng88
Электронная почта: [email protected]
В 16:16 18 января 2017 года CodeSuPrMan [email protected] написал:
Это исходный компонент без состояния
const LeftNavBefore = ({меню, отправка}) => {const {режим, ItemTree
} = props.menus; const constItemTree = ItemTree; const
NavMenu = LoadMenuTree (ItemTree, ItemTree); function changeMode (value) {
dispatch ({type: 'menus / changeMode', payload: {mode: value? 'vertical': 'inline',
ItemTree: ItemTree}}) ....}
Я хочу упаковать компоненты, которым необходимо добавить функции жизненного цикла, в виде высокоуровневых компонентов (эта функция будет извлечена в общий метод, и все функции жизненного цикла, которые необходимо добавить в будущем, упакованы с помощью этого метода. ),
Таким образом, все базовые компоненты по-прежнему не имеют состояния и требуют единой упаковки жизненного цикла.
function wapperComponentsStatus ({ref}) {return ComposedComponent => {
return class wapper расширяет React.Component {componentWillMount () {
... (извлечено позже)} componentDidMount () {... (извлечено позже)} render () {return}}}} `let LeftNav = ref => wapperComponentsStatus ({ref: ref}) (LeftNavbefore);
Чтобы подключиться сюда, вам необходимо подключиться к модели для передачи состояния и отправки
function mapStateToProps ({menus}) {
вернуться {меню};
}экспортировать соединение по умолчанию (mapStateToProps) (LeftNav); `
Но написание таким образом сообщит об ошибке, потому что понимание реакции и редукции не слишком глубокое, могу я спросить, следуете ли вы моему мнению,
Как передать свойства wrapperComponentsStatus компоненту LeftNavBefore (в основном для передачи функции статуса) и redux
Состояние и отправка, предоставленные после подключения, также передаются компоненту LeftNavBefore.-
Вы получили это, потому что прокомментировали.
Ответьте на это письмо напрямую, просмотрите его на GitHub
https://github.com/dvajs/dva/issues/506#issuecomment-273411035 или отключить звук
нить
https://github.com/notifications/unsubscribe-auth/AAbhwGIy_VXKLgjZAouvWgWg0i3aF6cGks5rTcpmgaJpZM4LkSJ0
.
Вы можете посмотреть на перекомпоновку, похоже, что жизненный цикл до
Только что возникла проблема с форматом. Это исходный компонент без состояния после редактирования.
const LeftNavbefore=({menus,dispatch})=>{
const s=props;
const{
mode,ItemTree
}=props.menus;
const constItemTree=ItemTree;
const NavMenu=LoadMenuTree(ItemTree,ItemTree);
function changeMode(value){
dispatch({
type:'menus/changeMode',
payload:{
mode:value?'vertical':'inline',
ItemTree:ItemTree
}
})
}
return(...)
Я хочу упаковать компоненты, которым необходимо добавить функции жизненного цикла, в виде высокоуровневых компонентов (эта функция будет извлечена в общий метод, и все функции жизненного цикла, которые необходимо добавить в будущем, будут упакованы с этот метод), так что все основные компоненты по-прежнему сохраняются без состояния, требует единой упаковки жизненного цикла
function wapperComponentsStatus({ref}) {
return ComposedComponent=>{
return class wapper extends React.Component {
componentWillMount(){
...(之后提取出来)
}
componentDidMount(){
...(之后提取出来)
}
render(){
return <ComposedComponent {...this.props} />
}
}
}
}
let LeftNav=ref=>wapperComponentsStatus({ref:ref})(LeftNavbefore);
function mapStateToProps({menus}){
return {menus};
}
export default connect(mapStateToProps)(LeftNav);
Но написание этого способа сообщит об ошибке, поскольку понимание реакции и редукции не слишком глубокое, могу ли я спросить, следую ли я своим мыслям, как передать реквизиты wrapperComponentsStatus компоненту LeftNavBefore (в основном, чтобы передать функцию статуса) и предоставить его после того, как redux connect State и dispatch также передаются в компонент LeftNavBefore
Вы можете сделать это сами
@nickzheng спасибо, дай посмотреть
Я не говорю по-английски. Мне остается только ждать зрелого плана. Текущий метод
Роль маршрутизатора состоит в том, чтобы связать модель и представление, а затем использовать React.Component для записи,
Среди них: this.props, расширенный и закрытый, временный, понятно, что там.Если эта страница не меняется, она назначается напрямую.
import React from 'react';
import { connect } from 'dva';
import { routerRedux } from 'dva/router';
import styles from './Page.css';
import { TabBar, Icon } from "antd-mobile";
import MyTabbar from './components/MyTabbar'
class Home extends React.Component {
render() {
const {menu,selectedTab,dispatch}= this.props;
const MyTabbarProps={ menu, selectedTab, dispatch }
return (
<div className="home">
{this.props.children}
<MyTabbar {...MyTabbarProps} />
</div>
);
}
}
Home.propTypes = {
menu:React.PropTypes.array,
selectedTab:React.PropTypes.number,
};
function mapStateToProps({home}) { return home }
export default connect(mapStateToProps)(Home);
прочитал перекомпоновал, но в итоге написал сам
import React, { Component,PropTypes } from 'react';
function wapperComponentsLifecycle({DidMount}) {
return ComposedComponent=>{
return class Wapper extends React.Component {
componentWillMount(){
}
componentDidMount(){
DidMount({props:this.props});
}
...还可以添加别的生命周期函数
render(){
return <ComposedComponent {...this.props} />
}
}
}
}
export default wapperComponentsLifecycle;
Ниже приведен призыв оставить все основные компоненты без состояния, вам нужно обернуть жизненный цикл этой функцией, чтобы обернуть его.
function DidMount({props}) {
const{ dispatch}=props;
dispatch({
type:'menus/query',
})
}
let LeftNav=wapperComponentsLifecycle({DidMount})(LeftNavbefore);
Снова посмотрев на документ два, есть такой абзац:
所以在 dva 中,通常需要 connect Model的组件都是 Route Components,组织在/routes/目录下,而/components/目录下则是纯组件(Presentational Components)
Для этого отрывка у меня есть понимание. Маршрутизатор пишет компоненты маршрута, которые собирают данные / компоненты и многое другое ..., и компоненты являются чисто функциональными компонентами, затем чистыми компонентами, без событий жизненного цикла.
Самый полезный комментарий
https://github.com/acdlite/recompose/blob/master/docs/API.md#lifecycle