摘要: ref属性:作为接口,向外暴露DOM。非受控组件。(该属性不建议使用) 1 <script type="text/babel"> 2 class MyComponent extends React.Component{ 3 handleClick= ()=>{ 4 console.log(this. 阅读全文
posted @ 2020-03-11 23:08 红桃七716 阅读(195) 评论(0) 推荐(0) 编辑
摘要: props属性:将组件外部的数据=>组件内部 任务:将组件外部的数据=>组件内部,渲染出来 1 <script type="text/babel"> 2 class MyComponent extends React.Component{ 3 render(){ 4 console.log(this 阅读全文
posted @ 2020-03-11 22:36 红桃七716 阅读(195) 评论(0) 推荐(0) 编辑
摘要: 任务:界面上有一行文字“甄姬”,当鼠标点击甄姬时,文字变为“安琪拉”;再点击再互换。 1 <script type="text/babel"> 2 class MyComponent extends React.Component{ 3 state = { 4 flag:true, 5 } 6 ha 阅读全文
posted @ 2020-03-11 21:55 红桃七716 阅读(408) 评论(0) 推荐(0) 编辑
摘要: 1、组件编写方式的注意事项: 组件名首字母必须大写; 虚拟DOM必须只有一个根元素; 虚拟DOM必须有结束标签。 2、两种组件编写方式 简单组件:使用工厂函数,不涉及state值的渲染 <script type="text/babel"> function Simple(){ return <h1> 阅读全文
posted @ 2020-03-11 21:15 红桃七716 阅读(139) 评论(0) 推荐(0) 编辑
摘要: 1、介绍 React:构建用户界面的JavaScript库,由Facebook出品的JS框架; babel.min.js:JS编译器,将JSX转换为标准的JS代码; react.development.js:React开发版核心代码,用于创建UI; react-dom.development.js: 阅读全文
posted @ 2020-03-11 20:12 红桃七716 阅读(132) 评论(0) 推荐(0) 编辑