- 博客(21)
- 收藏
- 关注
RSS订阅原创 React路由
react路由一、路由的安装及配置1.1路由的分类1.2路由的安装及配置1.3精确路由二、react动态路由的匹配2.1动态路由的实现（/:id）2.2动态路由的实现（/?属性名=属性值）三、路由嵌套3.1嵌套路由的模式一、路由的安装及配置1.1路由的分类react分为 普通组件和路由组件普通组件一般放在components文件中路由组件一般放在views文件中想要在react中实现组件之间的跳转 我们需要使用react路由在react中路由有两个：1 react-router2 rea
2021-08-27 00:40:18
146
原创 React脚手架的使用
react脚手架脚手架的安装/项目创建脚手架的全局安装脚手架的配置及应用依赖的安装与配置脚手架的安装/项目创建脚手架的全局安装1、电脑中需要有nodejs程序2、在桌面中输入win+R 输入cmd弹出这个页面在此处输入 npm i -g create-react-app 进行脚手架安装安装完成之后 然后我们创建项目在程序中输入 create-react-app 项目名称(项目名称需要英文并且有意义)项目创建完成的状态会自用跳转到此页面脚手架的配置及应用react脚手架中
2021-08-22 19:10:55
328
原创 react条件渲染、声明周期
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar
2021-08-22 16:58:35
167
原创 React第八天（非父子传值）
非父子组件传值1、非父子组件传值用可的方法例子1例子2context实现步骤1、非父子组件传值用可的方法例子1例如：组件b想要向组件c传值 组件b和组件c拥有共同的父组件app方法：我们可以使用首先将组件b中数据传递给 app 然后再将app里边的数据传递给c组件—当然后期我们还有其他方法—目前这是我们所学习中使用的方法以上是我们遇到的非父子通信的简单的一种形式例子2组件a 有个子组件b 组件b有一个子组件c 实现a数据传递给c组件直接实现组件a向组件c传值 跳
2021-08-20 12:00:37
228
原创 React学习第七天（数据请求）
react的数据请求我们用的比较多的数据请求的方式1、原生ajax2、基于jquery(基于js的一个插件库)的ajax3、 es6语法"jquery ajax"中请求的问题如何才能在jquery中使用this 解决办法是：在ajax外边对this进行赋值使用bind(this)来处理react数据请求例子react请求的位置react请求的例子我们用的比较多的数据请求的方式1、原生ajaxvar xhr=new xmlHttpRequest()使用GET方法的具体代码<script>
2021-08-20 00:41:39
640
原创 React学习第六天
表单的第二部分与react子父通信表单的textarea 与 selecttextarea事件select事件表单的textarea 与 select上次我们说了input的事件这次我们补充一下textarea与select事件textarea事件textarea事件与input事件基本一致select事件众所周知select是下拉选项框，我们需要使用option标签中的value 设置其选项值，标签包裹我们选项的内容，这里需要注意的是 value中的值也是我们需要去双向绑定获取的值不能改变
2021-08-18 13:27:30
82
原创 React第五天学习
react 表单表单事件表单事件在 React 里，HTML 表单元素的工作方式和其他的 DOM 元素有些不同，这是因为表单元素通常会保持一些内部的 state。react表单中 如果对表单元素添加了value 这个时候想要去修改表单里边数据的时候我们需要在表单元素的上边添加一个onChange事件如果不添加Change事件就会出现一下情况报错内容为：失败的属性类型：您为表单字段提供了一个’value’属性，但没有’onChange’处理程序。这将呈现只读字段。如果字段应该是可变的，请使
2021-08-16 00:21:48
115
1
原创 react_tab切换
链家房源基本功能实现导航栏数据动态引入 class Tab extends React.Component{ constructor(props){ super(props) this.state={ titles:['区域','房型','价格'], contents:[ ['郑州','开封'], ['一室','两室',], ['10万'
2021-08-15 17:08:18
332
原创 React第四天学习
react数据遍历与事件处理react数据的遍历react数据的遍历在react中如果想要对数据进行遍历 我们需要使用map方法（在react jsx语法中使用for foreach不起作用）例如：constructor(props) { super(props) this.state={ lists: [1,2,3] } }
2021-08-13 00:29:45
151
原创 使用React组件封装elemenui
element-ui组件封装创建子组件class Child extends React.Component{ render(){ return( <div className="btn"> <button>{this.props.children}</button> </div> ) } }{this.props.children}表
2021-08-12 23:10:45
191
原创 react学习第三天
React的props的使用和state状态一、state状态1.1使用react实现评论的隐藏与显示1.2react计时器写法props的使用一、state状态每个组件可以拥有自己的data数据,并且这个数据是自己独享在react中我们需要使用state(状态)来表示我们每一个组件自己的data数据在react中state需要在构造函数中进行设置 类似于vue中data data() {}例如： // react中state状态设置 //等同于构造函数 constrcu
2021-08-12 00:38:33
70
原创 React的基本使用
1. React的基本使用1.1. 安装脚手架create-react-app1.2. 创建项目2. JSX语法2.1. VSCode配置2.2. 插值2.3. 列表渲染2.4. 条件渲染2.5. 事件绑定3. React组件3.1. 类组件3.1.1. 存在的问题3.2. 无状态组件4. 组件状态提升（组件通信）5. Props的定义5.1. 限制prop类型5.2. prop默认值5.3. children5.4. 类名的操作1. .
2021-08-11 22:04:57
534
1
原创 node.js考试题
1.以下代码执行的结果是？const promise = new Promise((resolve, reject) => { console.log(1) resolve()//异步执行 console.log(2)})promise.then(() => { console.log(3)})console.log(4)2.有一个user表,score表，两者通过user表中的id，score表中的uid进行关联，请写出SQL语句。（左右连接都可以
2021-06-28 19:32:54
860
原创 vue04组件
Vue组件课程目标了解组件的应用场景理解组件的运行机制掌握组件的定义和使用组件是 Vue.js最核心的功能，也是整个框架设计最精彩的地方，当然也是最难掌握的。1、 组件1.1 为什么要使用组件 假设有这样一个需求，页面中需要一个input输入框，要求只能输入数字，并且有加减按钮实现加减，好，简单，不就是一个输入框，两个按钮，那还不是有手就行？不过，如果项目中其他地方也需要呢，那就复制粘贴呗，需要几个，复制粘贴几次。虽然这样也解决了问题，但是代码的重复度很高，维护成本也比
2021-06-28 19:31:48
75
原创 3阶段考前复习
node 模块化复习闭包+自执行函数实现模块化var 模块名 = (function(){ .... return { 变量1， 变量2 }})(引入其他的模块名...)ES6模块化export 变量的声明赋值import {变量名} from “模块路径”默认导出一个模块只能有一个默认导出，对于默认导出，导入的名称可以和导出的名称可以不一样。commonJS模块化//导出module.exports={导出的变量}exports.属性名 = value//导入
2021-06-25 16:43:40
106
原创 vue03计算属性过滤器watch
计算属性我们有时候会在模板中绑定表达式来做简单的数据处理，但是如果表达式太长，就会变得臃肿难以维护。比如以下代码<div> {{text.split(',').reverse().join(',')}}</div>表达式里面包含了3个操作，并不是很清晰，有时候可能会更加复杂，所以在遇到复杂的逻辑时，我们应该使用计算属性。上例可以用计算属性进行改写：<div id="app"> {{reverseText}}</div><
2021-06-24 20:46:29
375
原创 vue第二天
标题# vue学习第二天经过前一天的知识点学习，那么今天我们主要以案例练习为主，多敲代码，提高代码量才是学习编程的王道。1、key的作用假设现在有一个需求，在页面循环data中的数组。很简单，有手就行，分分钟写出来。 <div id="app"> <ul> <li v-for="(item, i) in list"> <input type="checkbox"> {{item.name}} </l
2021-06-23 20:16:42
56
原创 0603第三方模块
什么是第三方模块？别人写好的，具有特定功能的模块就是第三方模块，我们需要下载才可以使用获取第三方模块 ： npmjs.com(存储he分发第三方模块的cang)
2021-06-03 20:36:34
209
原创 0528 js考试
1.var、let、const 之间的区别 var定义的变量，没有块的概念，可以跨块访问, 不能跨函数访问。 let定义的变量，只能在块作用域里访问，不能跨块访问，也不能跨函数访问。 const用来定义常量，使用时必须初始化(即必须赋值)，只能在块作用域里访问，而且不能修改。 ...
2021-06-01 19:11:40
80
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人