jsx

当有遇到下划线的问题，会提示有问题，无法通过检测 需要在代码的前面加入以下代码就可以解决，地址是： https://stackoverflow.com/questions/44126983/eslint-unexpected-dangling-in-place-no-underscore-dangle /* eslint no-underscore-dangle: 0 */ 修改前 修改后 关于注释的问题，ESLint中，如果需要写入注释，需要在//与注释文字间加入一个空格 修改前 修改后 关于布尔值的问题，需要将布尔值修改为字符串才可以，参考地址： https://segmentfault.com/a/1190000013238465?utm_source=tag-newest 修改前 修改后 关于Expected blank line between class members lines-between-class-members的问题，只需要在每个方法后面，加入一行回车即可，参考地址： https://cloud.tencent.com/developer/section/1135636 修改前 修改后 关于Closing tag of a multiline JSX expression must be on its own line react/jsx-closing

代码规范很重要 1.组件名应该始终是多个单词的，根组件 App 除外。 2.组件的 data 必须是一个函数。 // In a .vue file export default { data () { return { foo: 'bar' } } } 3.Prop 定义应该尽量详细。【包含了类型、校验】 // 更好的做法！ props: { status: { type: String, required: true , validator: function (value) { return [ 'syncing' , 'synced' , 'version-conflict' , 'error' ].indexOf(value) !== -1 } } } 类型有： 单向数据流 ：所有的 prop 都使得其父子 prop 之间形成了一个 单向下行绑定 ：父级 prop 的更新会向下流动到子组件中，但是反过来则不行。 4.总是用 key 配合 v-for <ul> < li v - for ="todo in todos" :key ="todo.id" > {{ todo.text }} </li> </ul> 5.永远不要把 v-if 和 v-for 同时用在同一个元素上。 6.对于应用来说，顶级 App 组件和布局组件中的样式可以是全局的，但是其它所有组件都应该是有作用域的

翻译 | 《JavaScript Everywhere》第11章 用户界面和React（^_^） 写在最前面 大家好呀，我是毛小悠，是一位前端开发工程师。正在翻译一本英文技术书籍。 为了提高大家的阅读体验，对语句的结构和内容略有调整。如果发现本文中有存在瑕疵的地方，或者你有任何意见或者建议，可以在评论区留言，或者加我的微信：code_maomao，欢迎相互沟通交流学习。 (σﾟ∀ﾟ)σ..:*☆哎哟不错哦 第11章 用户界面和React 1979 年，著名的史蒂夫·乔布斯（ Steve Jobs ）访问了施乐帕克（ Xerox Parc ），在那里他看到了施乐 Alto 个人计算机的演示。当时其他计算机是由键入命令控制的，而 Alto 则使用鼠标并具有可打开和关闭的窗口图形界面。乔布斯在最初的 Apple Macintosh 的创作中继续借鉴了这些想法。原始 Mac 的流行导致计算机 UI 的激增。今天，在通常的一天，我们可能会与许多图形用户界面进行交互，其中可能包括个人计算机以及智能手机，平板电脑， ATM ，游戏机等。用户界面现在围绕着我们，可以跨各种设备、内容类型、屏幕尺寸和交互格式使用。 例如，我最近去了另一个城市开会。那天早上，我醒来并在手机上查看了航班状态。我开车开车去机场，屏幕上显示了地图，让我可以选择正在听的音乐。途中，我停在 ATM 机上取回一些现金，输入 PIN

1 jsx语法 2 组件 2.1 导入自定义组件 2.2 组件参数 2.3 组件的状态 2.4 生命周期 来源： oschina 链接： https://my.oschina.net/u/3575212/blog/3099778