cari

Rumah  >  Soal Jawab  >  teks badan

javascript - Beberapa soalan untuk pemula belajar Redux

Selepas membaca banyak maklumat, saya masih tidak memahami Redux dengan baik
1 Untuk Negara global, yang diuruskan oleh Kedai, di manakah ia dijana pada mulanya? Bagaimanakah ia ditambah kemudian? Selepas menambah, adakah kesemuanya berada dalam {} yang sama? Pastikan semua atribut tidak mempunyai nama yang sama

2. Dalam mod Redux, adakah setiap komponen (komponen yang memerlukan keadaan) perlu diikat dengan
connect( mapStateToProps ,mapDispatchToProps )(Component);?

3. Adakah semua Reducer akan menerima Tindakan?

Kemudian kod yang saya tulis dalam keadaan terpinga-pinga tidak berfungsi dan tiada mesej ralat:

import React from "react";
import ReactDOM from "react-dom";
import {createStore,bindActionCreators,combineReducers} from "redux";

import {Provider,connect} from "react-redux";

class Counter extends React.Component {
    render() {
        let { value1, onIncreaseClick, onDecreaseClick, value2, onDoubleClick, onResetClick } = this.props;
        return (
            <p>
                <p>
                    <p>{value1}</p>
                    <button onClick={onIncreaseClick}>Increase</button>
                    <button onClick={onDecreaseClick}>Decrease</button>
                </p>
                <p>
                    <p>{value2}</p>
                    <button onClick={onDoubleClick}>Double</button>
                    <button onClick={onResetClick}>Reset</button>
                </p>
            </p>
        )
    }
}
function mapStateToProps(state) {
    return { //obj
        value1:state.count,
        value2:state.count
    }
}
function mapDispatchToProps(dispatch) {
    return { //obj
        onIncreaseClick(){
            dispatch({type:"increase"});
        },
        onDecreaseClick(){
            dispatch({type:"decrease"});
        },
        onDoubleClick(){
            dispatch({type:"double"});
        },
        onResetClick(){
            dispatch({type:"reset"});
        }
    }
}

function counter1(state = { count: 0 }, action) {
    let count = state.count;
    switch (action.type) {
        case 'increase':
            return { count: count + 1 };
        case 'decrease':
            return { count: count-1 };
        default:
            return state;
    }
}
function counter2(state = { count: 0 }, action) {
    let count = state.count;
    switch (action.type) {
        case 'double':
            return { count: count*2 };
        case 'reset':
            return { count: 0 };
        default:
            return state;
    }
}
let rootReducer = combineReducers({
    counter1,
    counter2
});
let store = createStore(rootReducer);
let CounterCompo = connect(
    mapStateToProps,
    mapDispatchToProps
)(Counter);
ReactDOM.render(<Provider store={store}>
    <CounterCompo/>
</Provider>,document.getElementById('container'));
大家讲道理大家讲道理2764 hari yang lalu729

membalas semua(5)saya akan balas

  • 迷茫

    迷茫2017-05-19 10:35:34

    Mendapati masalah. . . . Perangkap combineReducers Selepas menggunakannya, Negeri dibahagikan kepada Reducer masing-masing

    balas
    0
  • 阿神

    阿神2017-05-19 10:35:34

    Sebenarnya, redux adalah sangat mudah Tindakan mewakili tindakan yang diubah, dan pengurang sepadan mewakili kesan tindakan yang sepadan.
    Menggunakan redux hanyalah ayat: komponen mana yang mempunyai perubahan data, penghantaran (tindakan) dalam komponen yang sepadan, dan komponen mana yang perlu menggunakan data dalam stor, lulus parameter mapStateToProps yang diperlukan untuk menyambung, kedua-duanya adalah bebas antara satu sama lain.

    balas
    0
  • 天蓬老师

    天蓬老师2017-05-19 10:35:34

    1 Sebenarnya, lebih tepatnya, Reducer adalah tempat kedai ditakrifkan. Setiap Reducer boleh diasingkan dan kemudian digabungkan bersama menggunakan combineReducers.
    2. Adalah disyorkan untuk hanya mengikat komponen peringkat tinggi, dan kemudian berinteraksi dengan komponen peringkat rendah melalui komponen peringkat tinggi.
    3. Anda boleh menerima semuanya.

    Adalah disyorkan untuk bermula dari Demo rasmi.

    balas
    0
  • PHPz

    PHPz2017-05-19 10:35:34

    http://huziketang.com/books/r...

    balas
    0
  • 阿神

    阿神2017-05-19 10:35:34

    Selepas membaca banyak maklumat, saya masih tidak memahami Redux dengan baik 1. Untuk Negara global, yang diuruskan oleh Kedai, di manakah ia dijana pada mulanya? Bagaimanakah ia ditambah kemudian? Selepas menambah, adakah kesemuanya berada dalam {} yang sama? Adakah anda perlu memastikan bahawa semua atribut tidak mempunyai nama pendua. Jawapan: Data awal boleh dikonfigurasikan dalam parameter kedua createStore kedai. Saya tidak faham bahawa atribut anda diduakan.
    2. Dalam mod Redux, adakah setiap komponen (komponen yang memerlukan keadaan) perlu diikat dengan

    connect( mapStateToProps , mapDispatchToProps )(Component);?

    Tidak semestinya

    3. Adakah semua Reducer akan menerima Tindakan?

    Setiap tindakan akan mencetuskan pengurangan yang sepadan

    balas
    0
  • Batalbalas