I declared a variable in the initialState of the index.js file dva using dva, but the browser mistakenly said it was Unexpected keys, and couldn"t get it in model. The code in
index.js looks like this,
const app = dva({
history: history,
initialState: {
data2: [
{ name: "dva", id: 1 },
{ name: "antd", id: 2 },
],
},
onError(e, dispatch) {
message.error(e.message,3);
},
});
app.model(require("./models/newModel").default);
app.router(require("./router").default);
app.start("-sharproot");
The code under the route folder is as follows
import NewCom from "../components/newCom";
const NewRoute = ({ dispatch, data2 }) => {
const handleDelete=(id)=> {
dispatch({
type: "newModel/delete",
payload: id,
});
}
return (
<div>
<h2>routesnewrtoue.js</h2>
<NewCom onDelete={handleDelete} dataSource={data2} ></NewCom>
</div>
);
}
export default connect( ({ data2 })=>{
return {
data2
}
} )( NewRoute );
The code under the model folder is as follows
export default {
namespace: "newModel",
state: {
},
reducers: {
"delete"(state, { payload: id }) {
return state.filter(item => item.id !== id);
},
},
};
The code under the components folder is as follows
import React from "react";
import PropTypes from "prop-types";
import { Table, Popconfirm, Button } from "antd";
const component = ({ onDelete, dataSource }) => {
const columns = [{
title: "Name",
dataIndex: "name",
}, {
title: "Actions",
render: (text, record) => {
return (
<Popconfirm title="Delete?" onConfirm={() => onDelete(record.id)}>
<Button>Delete</Button>
</Popconfirm>
);
},
}];
return (
<Table dataSource={dataSource} columns={columns} />
);
};
component.propTypes = {
onDelete: PropTypes.func.isRequired,
dataSource: PropTypes.array.isRequired,
};
export default component;
if you enter the page like this, the error message in the console will look like this
index.js:70704 Unexpected key "data2" found in preloadedState argument passed to createStore. Expected to find one of the known reducer keys instead: "routing", "@@dva", "newModel". Unexpected keys will be ignored.
index.js:70704 Warning: Failed prop type: The prop `dataSource` is marked as required in `component`, but its value is `undefined`.
data2modelstate