随笔分类 -  react-笔记-笔记-2022

react-笔记-笔记-2022
摘要:app.js import React from "react"; /* * 类组件必须要继承React.Component * 相较于函数组件,类组件的编写要麻烦一下, * 但是他俩的功能是一样的 * */ class App extends React.Component{ // 类组件中,必须 阅读全文
posted @ 2022-11-11 20:12 前端导师歌谣 阅读(11) 评论(0) 推荐(0) 编辑
摘要:<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>变量</title> <script> /* * var * - 没有块级作用域 * let * - 有块级作用域 * const * - 和let类似,具有块 阅读全文
posted @ 2022-11-05 20:41 前端导师歌谣 阅读(39) 评论(0) 推荐(0) 编辑
摘要:<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>箭头函数</title> <script> /* * 1.箭头函数中没有arguments * 2.箭头函数中没有自己的this * - 它的this总是外层作 阅读全文
posted @ 2022-11-05 20:41 前端导师歌谣 阅读(27) 评论(0) 推荐(0) 编辑
摘要:<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>箭头函数</title> <script> /* * 箭头函数 * - 只有一个参数的函数 * 参数 => 返回值 * - 如果没有参数,或多个参数,参数需要使 阅读全文
posted @ 2022-11-05 20:41 前端导师歌谣 阅读(39) 评论(0) 推荐(0) 编辑
摘要:<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>展开</title> <script> /* * 可以通过 ... 展开一个数组 * */ function fn(a, b, c) { return a + 阅读全文
posted @ 2022-11-05 20:41 前端导师歌谣 阅读(29) 评论(0) 推荐(0) 编辑
摘要:<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>解构赋值</title> <script> // let a, b; let arr = ['孙悟空', '猪八戒']; /* a = arr[0]; b = 阅读全文
posted @ 2022-11-05 20:41 前端导师歌谣 阅读(67) 评论(0) 推荐(0) 编辑
摘要:<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>三个API</title> <script src="script/react.development.js"></script> <script src="s 阅读全文
posted @ 2022-11-05 20:41 前端导师歌谣 阅读(11) 评论(0) 推荐(0) 编辑
摘要:<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>三个API</title> <script src="script/react.development.js"></script> <script src="s 阅读全文
posted @ 2022-11-05 20:41 前端导师歌谣 阅读(26) 评论(0) 推荐(0) 编辑
摘要:<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>Hello World</title> <!--引入react的核心库--> <script src="script/react.development.js" 阅读全文
posted @ 2022-11-05 20:41 前端导师歌谣 阅读(11) 评论(0) 推荐(0) 编辑
摘要:<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>数组的方法</title> <script> const arr = [1, 2, 3, 4, 5]; /* * map() * - 可以根据原有数组返回一个新 阅读全文
posted @ 2022-11-05 20:41 前端导师歌谣 阅读(162) 评论(0) 推荐(0) 编辑
摘要:<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>静态属性</title> <script> /* * 直接通过类调用的属性和方法被称为静态属性和静态方法 * */ class MyClass { // 使用s 阅读全文
posted @ 2022-11-05 20:41 前端导师歌谣 阅读(42) 评论(0) 推荐(0) 编辑
摘要:<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>继承</title> <script> // 将多个类中的重复代码提取出来 class Animal{ constructor(name, age) { thi 阅读全文
posted @ 2022-11-05 20:41 前端导师歌谣 阅读(108) 评论(0) 推荐(0) 编辑
摘要:<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>类</title> <script> class MyClass{ constructor() { // this.fn = this.fn.bind(this 阅读全文
posted @ 2022-11-05 20:41 前端导师歌谣 阅读(8) 评论(0) 推荐(0) 编辑
摘要:<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>类</title> <script> /* * 类 * - 类是对象的模板 * - 类决定了一个对象中有哪些属性和方法 * - 使用class关键字来定义一个类 阅读全文
posted @ 2022-11-05 20:41 前端导师歌谣 阅读(11) 评论(0) 推荐(0) 编辑
摘要:app.js const App = () => { return <div>我是App组件!</div> }; // 导出App export default App; index.js /* * 组件 * - React中组件有两种创建方式 * - 函数式组件 * - 函数组件就是一个返回JSX 阅读全文
posted @ 2022-11-05 20:41 前端导师歌谣 阅读(17) 评论(0) 推荐(0) 编辑
摘要:主界面 import ReactDOM from 'react-dom/client'; // 引入样式表 import './index.css'; // 创建一个React元素 const App = <div className="logs"> {/* 日志项容器 */} <div class 阅读全文
posted @ 2022-11-05 20:41 前端导师歌谣 阅读(43) 评论(0) 推荐(0) 编辑
摘要:index.html <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>React项目</title> </head> <body> <div id="root"></div> <!-- public/inde 阅读全文
posted @ 2022-11-05 20:41 前端导师歌谣 阅读(23) 评论(0) 推荐(0) 编辑
摘要:<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>虚拟DOM</title> <script src="script/react.development.js"></script> <script src="s 阅读全文
posted @ 2022-11-05 20:41 前端导师歌谣 阅读(33) 评论(0) 推荐(0) 编辑
摘要:<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>渲染列表</title> <script src="script/react.development.js"></script> <script src="sc 阅读全文
posted @ 2022-11-05 20:41 前端导师歌谣 阅读(38) 评论(0) 推荐(0) 编辑
摘要:<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>JSX的注意</title> <script src="script/react.development.js"></script> <script src=" 阅读全文
posted @ 2022-11-05 20:41 前端导师歌谣 阅读(29) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示