-
-
Save xgqfrms-GitHub/ef0260bce093baf5d4bfd31293832c7a to your computer and use it in GitHub Desktop.
1.React中的Form与HTML中的FORM的不同点包括
A.value/checked 属性设置后，用户输入无效
B.textarea的值要设置在value属性
C.select的value属性可以是数组
D.input/textarea的onChange用户每次输入都会触发（即使不失去焦点）
E.textarea的值要设置在value属性
2.关于React中的JSX，下面说法正确的是
A.类似XML的语法，用来描述组件树
B.必须是驼峰命名
C.属性名不能和JavaScript关键字冲突
D.JSX允许直接在模板插入JavaScript变量
3.关于受控组件和非受控组件，下面说法错误的是
A.一个受控的组件都有一个value属性，渲染一个受控的会展示出value属性的值
B.一个受控的组件不会维护它自己内部的状态，组件的渲染单纯的依赖于props
C.一个非受控的组件不会维护自己的状态
D.一个没有value属性的就是一个非受控组件。通过渲染的元素，任意的用户输入都会被立即反映出来
4.React中Element（元素）与Component（组件）的区别是
A.元素是对在屏幕上显示的DOM节点或其他组件简单的对象描述
B.元素是React中最小基本单位
C.组件是由元素构成的
D.元素数据结构是普通对象，而组件数据结构是类或纯函数
5.关于React，说法错误的是
A.React是一个用于构建用户界面的JavaScript库
B.React主要用于构建UI
C.React是一款MVC框架
D.React起源于Facebook的内部项目
- A.value/checked 属性设置后，用户输入无效
- B.textarea的值要设置在value属性
- C.select的value属性可以是数组
- D.input/textarea的onChange用户每次输入都会触发（即使不失去焦点）
- E.textarea的值要设置在value属性
- A .类似XML的语法，用来描述组件树；
- B .必须是驼峰命名；
- C .属性名不能和JavaScript关键字冲突；
- D .JSX允许直接在模板插入JavaScript变量；
- A .一个受控的组件都有一个value属性，渲染一个受控的会展示出value属性的值；
- B .一个受控的组件不会维护它自己内部的状态，组件的渲染单纯的依赖于props；
- C .一个非受控的组件不会维护自己的状态；
- D .一个没有value属性的就是一个非受控组件。通过渲染的元素，任意的用户输入都会被立即反映出来；
- A .元素是对在屏幕上显示的DOM节点或其他组件简单的对象描述；
- B .元素是React中最小基本单位；
- C .组件是由元素构成的；
- D .元素数据结构是普通对象，而组件数据结构是类或纯函数；
- A .React是一个用于构建用户界面的JavaScript库；
- B .React主要用于构建UI；
- C .React是一款MVC框架；
- D .React起源于Facebook的内部项目；
react-intl.js
https://github.com/yiminghe/learning-react/blob/master/examples/react-intl.js
https://github.com/yiminghe/learning-react/blob/master/examples/react-intl.html
import 'normalize.css';
import qs from 'qs';
import { addLocaleData, IntlProvider, FormattedMessage } from 'react-intl';
import React from 'react';
import ReactDOM from 'react-dom';
import scriptjs from 'scriptjs';
const locale = qs.parse(location.search && location.search.slice(1)).locale || 'en-US';
const localePrefix = locale.slice(0, locale.indexOf('-'));
const scripts = [];
if (!window.Intl) {
// should output by server by <script>
scripts.push(`https://as.alipayobjects.com/g/component/intl/1.0.1/Intl.js`);
scripts.push(`https://as.alipayobjects.com/g/component/intl/1.0.1/locale-data/jsonp/en-US.js`);
// the following should be output by server template conditionally by <script>
if (locale !== 'en-US') {
scripts.push(`https://as.alipayobjects.com/g/component/intl/1.0.1/locale-data/jsonp/${locale}.js`);
}
// end
}
// should output by server by <script>
scripts.push(`https://as.alipayobjects.com/g/component/react-intl/2.0.0/locale-data/en.js`);
// the following should be output by server template conditionally by <script>
if (localePrefix !== 'en') {
scripts.push(`https://as.alipayobjects.com/g/component/react-intl/2.0.0/locale-data/${localePrefix}.js`);
}
// end
const ready = () => {
addLocaleData(window.ReactIntlLocaleData[localePrefix]);
window.app = {
// output by server conditional
'zh-Hans-CN': {
'app.zh': '选择中文',
'app.en': '选择英文',
},
'en-US': {
'app.zh': 'choose chinese',
'app.en': 'choose english',
},
};
const defaultApp = window.app['en-US'];
const Test = React.createClass({
render() {
return (<div>
<p>
npm install react-intl@2.0.0
</p>
<p>
<a href="?locale=en-US"><FormattedMessage
id="app.en"
defaultMessage={defaultApp['app.en']}
/></a>
</p>
<p>
<a href="?locale=zh-Hans-CN"><FormattedMessage
id="app.zh"
defaultMessage={defaultApp['app.zh']}
/></a>
</p>
</div>);
},
});
ReactDOM.render(
<IntlProvider
locale={locale}
messages={window.app[locale] || defaultApp}
>
<Test />
</IntlProvider>,
document.getElementById('__react-content'));
};
if (scripts.length) {
scriptjs(scripts, ready);
} else {
ready();
}
阿里云大学 学习调查
https://page.aliyun.com/form/edu_class/page.htm
云课堂>React学习自测
https://yq.aliyun.com/exam/new/8