wangyc1234的博客

Javascript初学基础(二) javascript事件 事件是可以被javascript侦测到的行为 html事件是发生在html元素上的事情 HTML事件 html事件可以是浏览器行为，也可以是用户行为 html网页中每个元素都可以产生某些触发javascript函数的事件 html加载完成时 html input字段改变时 html按钮被点击时 例如，当button...

react安装——直接使用 一、普通方式，在HTML中引入react所需的库，可通过cdn引入 库：react、react-dom、babel(用于编译jsx，将其编译为js，也用于将es6转换为es5) <script src="https://unpkg.com/react@16/umd/react.development.js"></script> <scrip...

react元素渲染 一、更新元素渲染 react元素都是不可变的，当元素被创建渲染后，就无法改变它的属性或内容，更新的唯一方法就是创建一个新的元素，将其传入**ReactDOM.render()**方法，将内容再次渲染。 例如网页中的计时器，每秒更新一次当前时间： function timer() { const ele = ( <div> ...

react JSX 一、JSX官方概述 先来一行代码 const element = <h2>Hello, tsymq!</h2>; 这个标签语法不是一个字符串，也不是HTML，这中语法称为JSX，是一种JavaScript 的语法扩展，它具有 JavaScript 的全部功能。 JSX 是一个看起来很像 XML 的 JavaScript 语法扩展，它有以下优点： JS...

react 组件&props 一、函数组件和类组件 1.函数组件 有效的react函数组件，接受唯一的参数props，并返回一个react元素，在本质上是一个JavaScript函数 function Welcome(props){ return <h2>Welcome, {props.name}</h2> } 2.类组件 类组件是一个es6的class...

react state&生命周期 ps:本文大部分资料、内容来自react官方文档 在元素渲染中写的计时器，通过每秒执行一次ReactDOM.render()来更新页面，但现在希望只写一次代码，只调用一次ReactDOM.render()就能让<Clock />组件自动更新，这需要在<Clock />组件中添加state. 一、实现步骤： 创建一个同名的 ES6...

react 事件处理 一、react事件 1.事件的定义 React 事件的命名采用小驼峰式（camelCase），而不是纯小写。 使用 JSX 语法时你需要传入一个函数作为事件处理函数，而不是一个字符串。 function activateLasers(){ ... } <button onClick={activateLasers}> Activate Lase...

react 条件渲染 阻止组件渲染 在定义组件的render()方法中返回null可阻止该组件渲染 页面初始是显示警告消息的，当点击Hide后，state中的showWarning变为false，这导致警告消息组件被阻止渲染，即隐藏了警告消息 function WarningBanner(props) { if (!props.warn) { return null; ...