const DELAY = 1000;let count = 0; count = count + 1;

const user = 'world'; console.log(`hello ${user}`); // hello world // 多行 const content = `  Hello ${firstName},  Thanks for ordering ${qty} tickets to ${event}. `;

function logActivity(activity = 'skiing') { console.log(activity); } logActivity(); // skiing

[1, 2, 3].map(x => x + 1); // [2, 3, 4]

[1, 2, 3].map((function(x) { return x + 1; }).bind(this));

// 引入全部
import dva from 'dva'; // 引入部分 import { connect } from 'dva'; import { Link, Route } from 'dva/router'; // 引入全部并作为 github 对象 import * as github from './services/github'; // 导出默认 export default App; // 部分导出，需 import { App } from './file'; 引入 export class App extend Component {};

// 对象
const user = { name: 'guanguan', age: 2 }; const { name, age } = user; console.log(`${name} : ${age}`); // guanguan : 2 // 数组 const arr = [1, 2]; const [foo, bar] = arr; console.log(foo); // 1

const add = (state, { payload }) => {return state.concat(payload); };

const add = (state, { payload: todo }) => { return state.concat(todo); };

const name = 'duoduo'; const age = 8; const user = { name, age }; // { name: 'duoduo', age: 8 }

app.model({reducers: {add() {}  // 等同于 add: function() {} }, effects: { *addRemote() {} // 等同于 addRemote: function*() {} }, });

const todos = ['Learn dva']; [...todos, 'Learn antd']; // ['Learn dva', 'Learn antd']

const arr = ['a', 'b', 'c']; const [first, ...rest] = arr; rest; // ['b', 'c'] // With ignore const [first, , ...rest] = arr; rest; // ['c']

function directions(first, ...rest) {console.log(rest); } directions('a', 'b', 'c'); // ['b', 'c'];

function foo(x, y, z) {}
const args = [1,2,3]; // 下面两句效果相同 foo.apply(null, args); foo(...args);

const foo = {a: 1,b: 2, }; const bar = { b: 3, c: 2, }; const d = 4; const ret = { ...foo, ...bar, d }; // { a:1, b:3, c:2, d:4 }

fetch('/api/todos').then(res => res.json()) .then(data => ({ data })) .catch(err => ({ err }));

const delay = (timeout) => {return new Promise(resolve => { setTimeout(resolve, timeout); }); }; delay(1000).then(_ => { console.log('executed'); });

app.model({namespace: 'todos', effects: { *addRemote({ payload: todo }, { put, call }) { yield call(addTodo, todo); yield put({ type: 'add', payload: todo }); }, }, });

function App(props) {function handleClick() {props.dispatch({ type: 'app/create' }); } return <div onClick={handleClick}>${props.name}</div> }

class App extends React.Component {handleClick() { this.props.dispatch({ type: 'app/create' }); } render() { return <div onClick={this.handleClick.bind(this)}>${this.props.name}</div> } }

<App><Header /><MainContent /><Footer />
</App>

<h1 className="fancy">Hello dva</h1>

<h1>{ this.props.title }</h1>

<ul>{ this.props.todos.map((todo, i) => <li key={i}>{todo}</li>) } </ul>

<h1>{/* multiline comment */}{/*  multi  line  comment  */} { // single line } Hello </h1>

const attrs = {href: 'http://example.org', target: '_blank', }; <a {...attrs}>Hello</a>

const attrs = {href: 'http://example.org', target: '_blank', }; <a href={attrs.href} target={attrs.target}>Hello</a>

function App(props) {return <div>{props.name}</div>; } App.propTypes = { name: React.PropTypes.string.isRequired, };

.title {color: red;
}
:global(.title) {color: green; }

<App className={styles.title} /> // red <App className="title" /> // green

import classnames from 'classnames'; const App = (props) => { const cls = classnames({ btn: true, btnLarge: props.type === 'submit', btnSmall: props.type === 'edit', }); return <div className={ cls } />; }

<App type="submit" /> // btn btnLarge <App type="edit" /> // btn btnSmall

app.model({namespace: 'todos', state: [], reducers: { add(state, { payload: todo }) { return state.concat(todo); }, remove(state, { payload: id }) { return state.filter(todo => todo.id !== id); }, update(state, { payload: updatedTodo }) { return state.map(todo => { if (todo.id === updatedTodo.id) { return { ...todo, ...updatedTodo }; } else { return todo; } }); }, }, };

app.model({namespace: 'app', state: { todos: [], loading: false, }, reducers: { add(state, { payload: todo }) { const todos = state.todos.concat(todo); return { ...state, todos }; }, }, });

app.model({namespace: 'app', state: { a: { b: { todos: [], loading: false, }, }, }, reducers: { add(state, { payload: todo }) { const todos = state.a.b.todos.concat(todo); const b = { ...state.a.b, todos }; const a = { ...state.a, b }; return { ...state, a }; }, }, });

app.model({namespace: 'todos', effects: { *addRemote({ payload: todo }, { put, call }) { yield call(addTodo, todo); yield put({ type: 'add', payload: todo }); }, }, });

yield put({ type: 'todos/add', payload: 'Learn Dva' });

const result = yield call(fetch, '/todos');

const todos = yield select(state => state.todos);

const app = dva({onError(e, dispatch) { console.log(e.message); }, });

app.model({effects: {*addRemote() {try { // Your Code Here } catch(e) { console.log(e.message); } }, }, });

import request from '../util/request'; // GET request('/api/todos'); // POST request('/api/todos', { method: 'POST', body: JSON.stringify({ a: 1 }), });

{status: 'error',message: '', }

function parseErrorMessage({ data }) {const { status, message } = data; if (status === 'error') { throw new Error(message); } return { data }; }

app.model({subscriptions: {setup({ dispatch, history }) {history.listen(({ pathname }) => { if (pathname === '/users') { dispatch({ type: 'users/fetch', }); } }); }, }, });

import pathToRegexp from 'path-to-regexp'; // in subscription const match = pathToRegexp('/users/:userId/search').exec(pathname); if (match) { const userId = match[1]; // dispatch action with userId }

<Route path="/" component={App}> <Route path="accounts" component={Accounts}/> <Route path="statements" component={Statements}/> </Route>

import { connect } from 'dva'; function App() {} function mapStateToProps(state, ownProps) { return { users: state.users, }; } export default connect(mapStateToProps)(App);

import { routerRedux } from 'dva/router'; // Inside Effects yield put(routerRedux.push('/logout')); // Outside Effects dispatch(routerRedux.push('/logout')); // With query routerRedux.push({ pathname: '/logout', query: { page: 2, }, });

import createLogger from 'redux-logger'; const app = dva({ onAction: createLogger(), });

import { browserHistory } from 'dva/router'; const app = dva({ history: browserHistory, });

import { useRouterHistory } from 'dva/router'; import { createHashHistory } from 'history'; const app = dva({ history: useRouterHistory(createHashHistory)({ queryKey: false }), });