- 博客(32)
- 收藏
- 关注
RSS订阅原创 Error in render: “TypeError: Cannot read properties of undefined (reading ‘ljyh‘)“
vue渲染报错解决
2023-05-22 15:23:22
194
原创 vite创建vue3项目+vite.config.js配置
使用vite快速创建vue3项目开发环境正式开始创建项目结构可以说是十分的简洁，先把依赖装上vite.config.js基本配置以上就是vue.config.js文件的基本配置，需要更多配置的可以参考文档进行配置开发环境Vite需要Node.js版本> = 12.0.0检测node版本命令node -v正式开始创建npm init @vitejs/app 项目名称oryarn create @vitejs/app 项目名称安装时会让你选择 直接选择vue即可 之后用vscod
2022-04-18 11:56:30
9665
2
原创 react 创建项目 redux（详细）
安装yarn add react-redux reduxRouter.js修改1、引入import {Provider} from 'react-redux';2、引入storeimport Store from './store/store.js';3、入口注入<Provider store={Store}></Provider>全部代码如下import React from 'react';import { BrowserRouter, HashRou
2021-08-24 17:26:54
323
3
原创 react hooks认知及使用
前言Hook 是 React 16.8 的新增特性。它是完全可选的，并且100%向后兼容。它可以让你使用函数组件的方式，运用类组件以及 react 其他的一些特性，比如管理状态、生命周期钩子等。从概念上讲，React 组件一直更像是函数。而 Hook 则拥抱了函数，同时也没有牺牲 React 的精神原则。优点：1、代码可读性更强，原本同一块功能的代码逻辑被拆分在了不同的生命周期函数中，容易使开发者不利于维护和迭代，通过 React Hooks 可以将功能代码聚合，方便阅读维护。2、组件树层级变浅。
2021-08-22 20:21:42
238
2
原创 npm 包发布，包括本地发布和线上两种
npm 包发布方式（线上、线下）线下发布第一步，安装，开启第一个终端：npm install -g sinopia出现问题callback must be a funciton received undefined解决：local-fs.js文件第42行修改fs.unlink(tmp,function(){})第二步，启动，开启第二个终端：sinopia -l 127.0.0.1:4873cd 到某个指定仓库mkdir unit-restful-axios(包的名称)cd un
2021-08-19 17:21:39
1845
6
原创 mobx 在类组件中的使用以及函数组件中的使用
Mobx 在类组件和函数组件使用安装yarn add mobxyarn add mobx-react父级 入口1、引入 import { Provider } from 'mobx-react';2、引入 store.js new Store() 引入 一个新的store const stores = { newStore: new NewStore(), newStore1: new NewStore1(), }3、Prov
2021-08-19 11:56:19
2547
5
原创 ES6面试题（常见类型）
1、在子类中使用构造方法要注意什么？必须调用父类构造方法super()在构造方法中super()必须写在使用this之前2、箭头函数箭头函数的this绑定为定义箭头函数的环境中的this箭头函数不能做构造方法箭头函数的中不能使用arguments3、localStorage单个域容量5MB生命周期永久，sessionStorage是会话周期storage事件监听数据改变、删除，在window上监听此事件，本窗口不能监听到本窗口的storage事件4、用async声明的函数返回值
2021-08-11 11:43:54
314
3
原创 React里props和context几种使用场景
props场景1.传递属性等，this.props.属性名 (基础、复合)2.this.props.children 公共组件里的个别内容，闭合组件里的子内容3.<child left={<Left/>}/>接收一个组件4.子组件通过 callback调用父组件的方法5.传一个方法（方法返回一个div内容） <child left={this.fn()}/> fn(){return (<div>1111</div>)} con
2021-08-09 11:48:02
355
2
原创 react-router和mobx基本配置
路由配置1、导入包yarn add react-router-dom;PS:react-router 和 react-router-domreact-router: 实现了路由的核心功能。react-router-dom: 基于react-router，加入了在浏览器运行环境下的一些功能。react-router-dom 是 react-router 的加强版呗因为 React Native 也要路由系统呀。所以还有一个库叫 react-router-native，这个库也是基于 rea
2021-07-30 11:56:53
545
5
原创 js常见面试题总结
1.闭包是什么，有什么特性，对页面有什么影响闭包就是能够读取其他函数内部变量的函数。闭包的缺点：滥用闭包函数会造成内存泄露，因为闭包中引用到的包裹函数中定义的变量都永远不会被释放，所以我们应该在必要的时候，及时释放这个闭包函数2.什么是作用域？分为俩种一种是函数局部作用域，一种是全局作用域。定义一个函数就开辟了一个局部作用域，整个 js 执行环境有一个全局作用3.事件委托是什么利用事件冒泡的原理，让自己的所触发的事件，让他的父元素代替执行优点：（1）可以大量节省内存占用，减少事件注册
2021-07-29 09:39:57
124
4
转载 HTTP请求响应常见状态码详解（1~500）
一些常见的状态码为：200 - 服务器成功返回网页404 - 请求的网页不存在503 - 服务不可用详细说明：有关100的状态码说明100 （继续） 请求者应当继续提出请求。 服务器返回此代码表示已收到请求的第一部分，正在等待其余部分。101 （切换协议） 请求者已要求服务器切换协议，服务器已确认并准备切换。有关200的状态码说明200 （成功） 服务器已成功处理了请求。通常，这表示服务器提供了请求的网页。201 （已创建） 请求成功并且服务器创建了新的资源。202 （已接受）
2021-07-28 16:36:05
277
4
原创 数组和对象方法说明及常见问题罗列
数组方法push() 从后面添加元素，返回值为添加完后的数组的长度arr.pop() 从后面删除元素，只能是一个，返回值是删除的元素arr.shift() 从前面删除元素，只能删除一个 返回值是删除的元素arr.unshift() 从前面添加元素, 返回值是添加完后的数组的长度arr.splice(i,n) 删除从i(索引值)开始之后的那个元素。返回值是删除的元素arr.concat() 连接两个数组 返回值为连接后的新数组str.split() 将字符串转化为数组 arr.s
2021-07-28 11:11:09
189
1
原创 React页面内容切换
React页面内容切换简单实现方式实现思路 1、选有html+css 罗列布局 2、使用css 进行样式布局可以使用css 能改变具体显示状态 3、在html 可以增加或修改对应class 来实现页面布局 4、把对应可变的class 通过state 单独提出来 5、修改state 默认值可以进行理想版块显示 6、增加setState方法 可以轻松设置class 来改变想要的布局 7、通过点击事件来切换对应的class代码如下import React, { Component } fro
2021-07-23 11:19:41
1852
4
原创 React 分页
React 获取接口数据实现分页效果以拼多多接口为例实现思路加载前 加载动画加载后 判断有内容的时候 无内容的时候用到的知识点1、动画效果（用在加载前，加载之后就隐藏或关闭，用开关效果即可）2、axios请求3、map渲染页面4、分页插件（antd）代码实现import React, { Component } from 'react';//引入axiosimport axios from 'axios';//引入antd插件import { Pagination }
2021-07-16 12:11:20
1079
2
原创 HTML+CSS面试题
HTML+CSS面试题1、你做的页面在哪些流览器测试过？这些浏览器的内核分别是什么?IE: trident 内核 Firefox：gecko 内核 Safari:webkit 内核 Opera:以前是 presto 内核，Opera 现已改用 Google Chrome 的 Blink 内核Chrome:Blink(基于 webkit，Google 与 Opera Software 共同开发)2、每个 HTML 文件里开头都有个很重要的东西，Doctype，知道这是干什么的吗？ <!
2021-07-15 16:57:23
283
3
原创 React 事件onClick
React 事件处理（冒泡及阻止默认事件）react 事件注意的点以及案例详情1、驼峰形式 onClick2、调用 onClick={this.Fn} this指向问题3、解决指向 1、箭头函数 onLog1 = ()=>{} 2、constructor this.fn = this.fn.bind(this) // 事件处理函数绑定实例 onClick={this.Fn} 3、onClick={()=>{this.onLog2('
2021-07-15 11:51:45
842
2
原创 React 实现tab切换效果
React 实现tab切换效果html以及js代码逻辑class Views extends Component { constructor(props) { super(props); this.state = { current:1, } } tabFn(index) { this.setState({ current:index }) } clsFn(_index,curCls,cls) { // 如果符合
2021-07-15 11:15:48
1197
5
原创 前端性能优化方法
前端性能优化方法减少HTTP请求js css 文件合并压缩js 按需加载css 背景图合并css 首页单独放到head 标签的style里base64 svg图片懒加载利用浏览器缓存缓存分为： 强缓存 协商缓存具体自己补使用CDN内容分发网络......一些注意的地方慎用with 避免使用 eval和 Function事件操作使用 事件委托...避免重定向减少 DOM 元素数量尽量减少 iframe 使用避免 404 错误避免图片 src 为空
2021-07-14 11:19:29
65
1
原创 css实现两栏布局，左侧固定宽，右侧自适应的7中方法
css实现两栏布局，左侧固定宽，右侧自适应的7中方法1、利用 calc 计算宽度的方法css代码:.box>div{height: 100%;}#box1>div{float: left;}.left1{width: 100px;background: yellow;}.right1{background: #09c;width:calc(100% - 100px);}dom结构:<div class="box" id="box1"> <div cla
2021-07-08 16:23:18
211
5
原创 React基本项目创建
React基本项目创建基本搭建在创建之前，需要有一个git 仓库，我们要把项目搭建到git 中步骤第一步：git clone 链接 远程仓库第二步：cd 文件名 到仓库文件下第三步：确认node 版本（node -v）【使用nvm use v14 切换】第四步：npx create-react-app first-react第五步：git add --all 提交所有文件git commit -m ‘up’第六步：cd first-react第七步：yarn eject （配置文件）
2021-07-07 16:36:28
127
6
原创 (前端)ps基础使用
(前端)ps基础使用对不同图片的拷贝ctrl+c (jpg、png)ctrl+shift+c (psd)新建大小一样的ctrl+n粘贴进去ctrl+v保存ctrl+shift+alt+s根据不同的要求保存一些基本工具使用移动工具需要选中对象才可以移动，可以快捷键ctrl+手表左键，按住ctrl键点击就可以选中。 快捷键是v选框工具只有四种选框形态，框出后的是选区，可以用来描边等。形状工具框出后的是形状，后期可以更改形状，较为方便。魔棒工具选择区域内相同色块的颜色选
2021-07-07 16:16:55
208
2
原创 vue-router认知
vue-router路由定义：根据不同的url加载不同的页面或内容。安装npm i vue-routeryarn add vue-routerapi组成new VueRouter({ // 模式 mode:'hash', // 路由匹配项 routes:[ { path:'/路径', component:加载组件, name:'命名路由', alias:'/路由别名', redirect:'/重定向',
2021-07-06 20:26:08
98
4
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人