小刘，刘不刘-CSDN博客

原创 vue是什么？vue基础指令，双向绑定，条件渲染

概念：Vue (读音 /vjuː/，类似于 view) 是一套构建用户界面的渐进式框架基于数据渲染出用户可以看到的界面什么是渐进式？所谓渐进式就是循序渐进，不一定非得把Vue中的所有API都学完才能开发Vue，可以学一点开发一点所谓框架：就是一套完整的解决方案库，类似工具箱，是一堆方法的集合，比如 axios、lodash、echarts等框架，是一套完整的解决方案，实现了大部分功能，我们只需要按照一定的规则去编码即可。框架的特点：有一套必须让开发者遵守的规则或者约束创建Vue实例准备容器。

2024-07-02 09:30:53 991

原创 JavaScript LocalStorage的使用指南

因此对于不一样的场景，localStorage和sessionStorage都有用武之地。3.对开发人员比较友好：window.localStorage.setItem("Test data ", "Hello from localStorage")添加数据。1.localStorage是存储在web浏览器里面的数据，只要不去清楚就会一直保存在浏览器即是关闭了页面。在谷歌的浏览器中存储的数据量高达5mb远大于cookie。在web浏览器中，web存储的api提供了在浏览器中以键值对的数据形式存储的机制。

2024-07-02 08:55:34 258

原创什么是回调函数？callback（）

fn（callback）这种回调方式调用就依然是先执行fn（）然后是func（）他同样可以执行成上面这种结果，那么为什么需要回调函数的存在呢？首先要知道一个点就是在js中，函数是可以作为函数的参数传递的。所以回调函数可以解决异步执行的逻辑函数的一个顺序的问题。当然如果我把fn（）里面的逻辑异步执行呢？结果会是先执行func（）然后执行的fn（）所以其实回调函数就是这个传进去的参数。其实回调函数的本质样子和普通函数是一样的。对了callback就是func（）

2024-06-05 20:52:36 199

原创 react中的useEffect()的使用

首先useEffect()是个函数，接受两个参数，第一个参数是一个方法，第二个参数是数组称为依赖项数组，可以没有。第二个参数的不同会影响第一个参数方法的使用。另外还有一种情况就是清除useEffect（）的副作用，直接在第一个参数函数里面写一个return一个函数，就会在组件卸载的时候自动清理。useEffect()是react中的hook函数，作用是用于创建。，而不是事件的触发，比如Ajax请求，DOM的更改。依赖项数组不同的区别。

2024-05-23 16:37:28 511 1

原创 react使用context机制，跨层传参数

2.在顶层组件通过Provider组件提供数据 value传的就是提供的数据。3.在底层组件使用钩子函数useContext（）消费数据。1.利用createContext创建一个上下文对象。

2024-05-21 22:48:44 107

原创 react兄弟传参子传父父传子

react中兄弟组件传参数，和vue思想是一致的，首先是子传给父，再由父传给另一个孩子。3.在子组件接收父组件传过来的函数，先解构再绑定到触发父组件传过来的这个函数上。2.在父组件定义好一个函数传给儿子传给儿子。1.在儿子组件定义好想要传给父组件的消息。4.定义一个useState（）状态变量。5.然后绑定在父组件的子组件的调用上面。6.在子组件调用传回的数据。

2024-05-21 22:24:51 232

原创 react中子传父信息

在父组件定义一个函数接受参数，接收的参数用于接收子组件的信息，把函数传给子组件，子组件调用父亲传来的函数并把要告诉父亲的话传到函数中，就实现了子传父消息。

2024-05-21 20:20:00 534

原创组件传参，子组件嵌套标签，在父组件使用，等于给父组件的props.children传参数值

【代码】组件传参，子组件嵌套标签，在父组件使用，等于给父组件的props.children传参数值。

2024-05-21 20:05:38 75

原创 react中父传子，要求儿子只能读父亲传的消息不能进行修改消息

如果我设置props.name为xxx就会报以下错误告诉你，在react中子组件只能读不能修改数据。

2024-05-21 19:53:59 129

原创 react组件传参父传子可以传字符串，布尔值，数组，对象，jsx，

在react中，父传子组件 props的灵活性是很强大的，可以传字符串，布尔值，数组，对象，jsx，

2024-05-21 19:50:21 379

原创 react获取dom

1.使用useRef(),在标签上绑定对应的ref={}2.使用useRef（）.current获取dom。

2024-05-20 11:45:46 120

原创 react简单条件渲染两种方式&&或者三目表达式

在react中，条件渲染是常见的使用方式。接下来介绍两种简单的条件渲染方式。

2024-05-20 11:28:53 124

原创 react中的数据驱动视图，useState（）的使用

前端开发如今有一个很重要的思想就是数据驱动视图，数据发生变化使ui发生变化，比如一个变量count，为0显示三个按钮，为1显示一个按钮，为2显示两个按钮。这就是一个简单的数据驱动视图。这里用到了useState（）方法，他返回一个数组，然后我们使用的方式，数组解构，两个参数第一个参数是值，第二个参数是改变第一个参数的值，并且第二个参数是一个方法。

2024-05-20 10:59:35 330

原创 jsx复杂条件渲染

用函数返回不同条件下需要渲染的样式然后进行调用。在return中调用函数即可。

2024-05-19 23:58:45 75

原创 jsx实现列表渲染

使用jsx实现列表渲染要使用js原生的map方法。

2024-05-19 23:45:20 115

原创如何在umi项目中使用ant-design组件库

然后在xxx.tsx页面，导入需要的组件，然后即可使用。首先使用终端命令创建一个react页面，umi使用antdv很简单，

2024-05-15 09:32:30 202

原创 umi项目运行时配置，app.ts

运行时配置和配置的区别是他跑在浏览器端，基于此，我们可以在这里写函数、tsx、import 浏览器端依赖等等，注意不要引入 node 依赖。const layout 就是关于页面layout的布局，关于layout的具体属性配置可以查询umi官网的umiMax。用于配置全局的网络请求，你可以在这里做拦截器，全局错误处理，鉴权的配置。我们把src下面的app.ts文件定为运行时候的配置。用于获取初始化数据，初始化数据使用。在各个组件中使用，在请求中。举一个例子，在运行时候的配置，

2024-05-15 09:27:58 463

原创 umi项目配置之项目构建时配置umirc.ts

按照官网项目默认使用的是.umirc.ts，如果想要使用自己的配置，那么在根目录创建config/config.ts，并且删除.umirc.ts，不然还会读取.umirc.ts。hash history - 适用于旧版浏览器，或者你想把 location 保存到 hash 部分，避免由于后端服务器不支持而报错。，值得注意的是这两个文件功能一致，仅仅是存在目录不同，2 选 1 ，对于 umi 中能使用的自定义配置，你可以使用项目根目录的。插件配置，开启和使用插件需要在配置页面做插件配置。

2024-05-14 22:48:37 705

原创 umi搭建react项目

UMI 是一个基于 React 的可扩展企业级前端应用框架，提供路由、状态管理、构建和部署等功能，可以帮助开发者快速构建复杂的单页面应用（SPA）和多页面应用（MPA）。它与 React 的关系是，UMI 构建在 React 生态系统之上，利用 React 提供的组件化开发方式和生态系统的丰富资源来进行开发。正是因为umi的优秀，为了方便开发者更加方便的使用这些插件，在我们这些插件开源的基础上，直接将他们集成到一起，打造了。让开发者直接可以通过脚手架马上获得和蚂蚁集团开发 Umi 应用一样的开发体检。

2024-05-14 22:40:07 433

原创速成react篇一：如何创建和嵌套组件，如何添加标签和样式，如何显示数据，如何渲染条件和列表，如何对事件做出响应并更新界面

第二，使用了es6的导出语法在外组件的时候。这里补充一个知识点，因为react大部分时候都会使用jsx或者tsx进行开发，使用它们的原因是因为他方便，并且严格，方便是可以在js中写dom和js代码，严格是必须用闭合标签，并且你的组件也不能返回多个 JSX 标签。以这个例子，我们要知道，在js中写dom的方式是 return （），在（）里面写dom，如果编写的dom只有一行，则可以在return后面空格紧跟不用括号包起来，但是仅限于只有一行代码的情况，如果有多行或者换行如下例子这种，必须包在括号里面。

2024-05-13 23:39:14 684

原创 vue组件传参数

总结：子组件传父组件消息的思路：子组件定义好defineEmits（）然后触发emits，并把消息发送给父组件，最后在父组件里面用@监听自定义的事件，最后通过绑定自定义事件的方法读取子组件传给父组件的消息。第三步：接收子组件的消息，因为是自定义的事件，因此用v-on监听，也就是@，因此在父组件里面监听自定义的事件，自定义事件绑定的方法都有一个参数，参数值就是子组件告诉父组件的消息。emits接收多个参数，第一个参数是自定义的事件名，后面的参数都是传给父亲的消息。2.接收父组件传给子组件的信息。

2024-05-07 23:45:13 508

原创 mac安装git

打开终端输入git --version查看是否有git。如果没有，输入git 根据指示进行安装。

2024-04-25 11:59:54 125

原创 form-serialize插件，快速收集表单元素的值

serialize方法有两个参数，第一个是获取到的表单dom，第二个是配置项对象，常用的配置项有hash和empty都是布尔类型，form-serialize插件可以快速获得表单元素的值，主要用于当表单很多的情况下，将表单的值一起打包发给服务器。4.给表单对应的输入框绑定name属性，name属性的值就是接口文档对应的字段。3.使用插件的serialize方法。2.获取表单的dom。

2024-04-24 22:03:35 287

原创利用递归实现深拷贝

定义一个数组或者对象，根据原数据的引用类型判断，然后定义递归的方法。先判断是不是数组，在判断是不是对象，如果都不是，直接赋值。是数组，则定义一个数组，是对象则定义一个对象。递归实现深拷贝的逻辑就是。

2024-04-24 17:38:10 170

原创 mac电脑搭建vue项目（下篇）

（4）把npm全局安装路径改为/usr/local/lib/node_modules，执行以下命令。（2）执行命令cnpm -v查看版本信息，结果说找不到cnpm命令。（3）执行no,回车。然后输入命令安装webpack-cli。（1）执行以下命令安装cnpm淘宝镜像。（7）再次执行查看cnpm版本号的命令。（3）查看npm的全局安装路径。（2）查看webpack版本号。（5）重新安装npm脚手架。第四步：安装webpack。vue项目前期环境安装好了。第五步：安装vue脚手架。（6）重新安装淘宝镜像。

2024-04-23 18:48:25 698

空空如也

空空如也