First, today's main task of the Sydney Small Program background Management development: Site Management page: Get the existing data list, select some of the data presented in the table, according to the name of the site, classification to filter out the corresponding attractions. Second, difficulty 1. Project Technology selection: Ant design, react, es6;2. Before this, only a little bit of es6 grammar, not real, react also just read grammar, not real; Ant design is a ghost, the first time I heard. 3. Main problems encountered: (1) Use of table components in ant design: introduction of table, Buttton, col, row, select components = import {table, Button, col, row, select} From ' Antd '; Assert option under Select = Const OPTION = select.option, using = = <SELECT><OPTION></OPTION></SELECT&G R;} The Button is component-= Const Buttongroup = Button.group, using the = = <buttongroup><button></button></ buttongroup>; Create Table => <table rowkey={(record) = Record.id} columns={columns} datasource={sites} pagination={false The bordered size= "middle"/> record is each row of data obtained from the datasources, and when the line is created, ant design automatically creates a unique ID for each row, creating columns in columns, such as Const COLUMNS = [{title: ' Chinese name ',///Column name Dataindex: ' Cntitle ',//column data, value from DataSource object, requires property name to be the same to be taken to the correct Value key: ' Cntitle ', }, {title: ' EnglishName ', Dataindex: ' Entitle ', key: ' Entitle ',}] (2) error messages, 500 server errors, 401 unauthorized, (see if the user information in application is out of date), network Request for information, request results, Network-headers: View request URL, request method, and request status; Network-request Payload: View the fields and their values returned by the request;
Use of components such as 2017.11.6-ant design table, and the use of network in chrome