- 博客(27)
- 收藏
- 关注
转载 Vue3入门学习-天宇老师课堂笔记
记录张天宇老师Vue3的教学知识学习笔记,侵删打包大小减少41%初次渲染快55%, 更新渲染快133%内存减少54%…使用Proxy代替defineProperty实现响应式重写虚拟DOM的实现和Tree-Shaking…Composition API(组合API)新的内置组件其他改变官方文档:https://cli.vuejs.org/zh/guide/creating-a-project.html#vue-create2.使用 vite 创建官方文档:https://v3.cn.vuejs.org/
2022-06-15 09:52:10 561
原创 常见的css选择器
由于css中的类选择器用法较多,时间长了,总是容易遗忘,因此对这部分内容做了一些简单的总结一、后代选择器<html><head><style type="text/css">ul em {color:red; font-weight:bold;}</style></head><body><ul> <li>List item 1 <ol> <li>
2022-05-06 10:44:21 158
原创 异步action以及redux中间件——thunk和promise的使用
一、什么是异步action通俗的说,同步action:返回一个对象;异步action:返回一个函数二、什么时候使用异步action从Redux官网中
2022-02-22 16:45:21 781
原创 nrm的使用
一、什么是nrmnrm 是一个 npm 源管理器,可以帮助我们快速地在 npm源之间切换二、为什么要使用nrmnpm的默认下载仓储地址是: https://registry.npmjs.org/,这是外国的网站,当使用npm来安装一些包时,往往速度会比较慢,大多数时候会配置国内的淘宝镜像cnpm。但是有些时候,又需要切换回来,这时使用nrm,就可以帮助我们实现快速地在 npm 源间切换,避免记忆仓储url地址的麻烦。三、nrm的用法1.安装npm install -g nrm2.查看所有仓储
2022-02-15 20:35:36 1062
原创 VueCLI中怎么配置代理解决跨域问题
方法一——只能配置一个代理客户端8080给服务端5000传递数据,但是由于存在跨域问题,需要配置代理 在vue.config.js中添加如下配置:devServer:{ proxy:"http://localhost:5000" //这里端口号和服务器端保持一致}说明:优点:配置简单缺点:不能配置多个代理工作方式:若按照上述配置代理,当请求的资源在前端不存在时,才会将该请求转发给服务器 (优先匹配前端资源)方法二——配置多个代理 编写vue.config.js配置具体
2021-12-28 19:46:52 842
原创 Vue中的父传子、子传父以及任意组件之间通信
方法一、借助函数父组件给子组件传递一个函数,子组件接收到这个函数后,在函数中传入参数,对该参数的操作交给父组件来完成,由此可实现子传父功能
2021-12-27 19:46:27 522
原创 使用VueCLI创建项目后关闭eslint
在package.json文件的同一目录下,创建vue.config.js文件,内容配置如下:module.exports = { lintOnSave: false }可关闭eslint语法检查更多设置可参考VueCLI官方配置参考
2021-12-22 19:26:44 635
原创 VueCLI中为什么使用render函数而不使用template模板解析
一、问题使用VueCLI时,若在main,js中使用模板的方式,此时页面并不渲染new Vue({el: '#app',template: `<App></App>`,components: {App}})控制台页面报错提示根据报错提出两种解决办法:1.使用render函数2.使用完整版的Vue二、为什么在main.js文件中通过以下方式引入Vue时,此时使用的运行版本的vue( vue.runtime.js),而在该版本中缺少了模板解析器import
2021-12-22 19:18:58 1208
原创 如何在python中调用MATLAB代码(利用anaconda完美解决多python环境问题)
不知道有没有小伙伴遇到和我一样的问题,需要在python代码中使用MATLAB代码运行得到的结果,但是如果直接将MATLAB改写成python,工作量又被加大那么这时候就需要利用官方给出的方法,在python中调用MATLAB这里可参考官方给出的解决方法整理:根据自己安装的MATLAB版本去找到对应版本的python这里以matlab2017a版本为例,对应python3.5进入MATLAB的安装目录安装用于 Python 的 MATLAB 引擎 API(最好以管理员身份打开)D:
2021-06-25 17:32:33 4791
原创 关于python中三维数组的切片问题
要想弄清楚三维数组的切片问题,首先要明白三维数组的维度,定义一个三维数组,将其维度打印输出:import numpy as npb = np.array([ [[1, 2, 3, 4], [5, 6, 7, 8], [9, 10, 11, 12]], [[13, 14, 15, 16], [17, 18, 19, 20], [21, 22, 23, 24]], [[25, 26, 27, 28], [29, 30, 31, 32], [33, 34, 35, 36]],
2021-03-25 13:24:39 8598 8
原创 爬取数据时出现中文乱码问题
解决方法:response = request.get(url=url)print(response.text)此时发现直接打印response.text会出现大量的中文乱码,多做一步操作,改为:response = request.get(url=url)print(response.content.decode('utf-8'))成功解决乱码问题...
2021-03-18 19:22:52 513
原创 scrapy的数据持久化存储
方法一、基于终端命令parse方法中存在一个返回值,一般是字典或者列表,将该返回值存储到本地文件中,只需要执行指令:scrapy crawl xxx -o filePath该方法简洁高效,但是数据只能存储到指定类型的文件中,局限性叫强 Set a supported one (('json', 'jsonlines', 'jl', 'csv', 'xml', 'marshal', 'pickle')) after a colon at the end of the output URI (i.e. -
2021-03-18 18:13:14 243
原创 INFO: Overridden settings: {‘BOT_NAME‘: ‘proName‘, ‘NEWSPIDER_MODULE‘: ‘proName.spiders‘, ‘ROBOTS
在使用scrapy框架进行数据爬取时,并不能返回有效的response,此时将settings.py文件中的ROBOTSTXT_OBEY = True改为ROBOTSTXT_OBEY = False即可。同时对于终端打印出来的过多的日志内容,可以通过在配置文件中设置LOG_LEVEL = ‘True’,此时终端会省去过多的日志内容,而保留报错内容部分...
2021-03-18 11:47:16 1559
原创 十二、npm包serve的使用
当前端打包好包后,想在服务器上部署,看一下运行效果,但是此时,若是去特地运用node或java去搭建服务器,又过于麻烦,此时可以借助npm包serve
2021-03-10 09:37:37 1833
原创 十、react-redux中共享数据状态
一、案例:定义一个Person组件,和Count组件通过redux共享数据为Person组件编写reducer和actionreducers/person.jsconst initState = [{id:'001',name: 'Tom', age: 18}]export default function personReducer(prestate=initState, action) { const {type, data} = action switch(type) {
2021-03-09 15:30:09 283
原创 九、react-redux的使用
一、什么是react-redux?react-redux是react的一个插件库,这点和redux不一样,react-redux是专门用来简化react中使用redux二、react-redux原理图三、react-Redux将所有组件分成两大类UI组件:只负责 UI 的呈现,不带有任何业务逻辑通过props接收数据(一般数据和函数)不使用任何 Redux 的 API一般保存在components文件夹下容器组件负责管理数据和业务逻辑,不负责UI的呈现使用 R
2021-03-09 14:33:58 135
原创 八、异步action编码时报错:Error: Actions must be plain objects. Use custom middleware for async actions.
一、什么是同步action?什么是异步action?同步action,就是指action的值为Object类型的一般对象异步action,就是指action的值为函数,异步action中一般都会调用同步action,异步action不是必须要用的。那么什么时候使用异步action呢?想要对状态进行操作,但是具体的数据靠异步任务返回异步action不是必须要写的,完全可以自己等待异步任务的结果了再去分发同步action二、异步action的具体编码编码时报错:Error: Actions m
2021-03-08 14:45:35 1334
原创 七、redux基础知识
安装npm install reduxAPIstore.getState()——获取状态store.dispatch()——通知reducer工作store.subscribe()——专门用来订阅reducer中状态是否变化
2021-03-08 11:09:27 148
原创 使用create-react-app创建项目时报错
报错内容:You are running `create-react-app` 4.0.2, which is behind the latest release (4.0.3).We no longer support global installation of Create React App.Please remove any global installs with one of the following commands:- npm uninstall -g create-reac
2021-03-01 17:32:33 1868
原创 七、React中UI组件库的使用——antd
基于React封装UI组件库,其中Ant Design是比较常用的安装:npm install antd使用:注意:引入样式后,样式才能生效import 'antd/dist/antd.css'
2021-02-28 17:24:53 461 1
原创 六、React中有关路由内容
一、路由的使用安装npm install react-router-dom在原生中使用a标签实现跳转,在react中根据路由连接实现切换组件App标签的最外层包裹一个BrowseRouter或者HashRouter标签import { Link,Route } from 'react-router-dom'<Link className="list-group-item" to="/home">Home</Link><Link className="l
2021-02-27 21:14:12 179
原创 三、React中处理跨域的两种方法
方法一安装axiosnpm install axiosclient端口为3000,server端口为5000client向server发送请求:axios.get('http://localhost:5000/xxxxxx').then( response => {console.log('成功了',response.data);}, error => {console.log('失败了',error);})注意:由于client和server的端口不一样,此时存
2021-02-23 22:27:07 585
原创 四、React中利用发布订阅机制(PubSub)来解决组件之间的数据传递
一、关于父子组件之间的通信父组件给子组件传递数据:利用props子组件给父组件传递数据:父组件先通过props 给子组件传递一个函数,要求子组件执行这个函数,同时传递一个参数,此时父组件中的函数可以拿到这个参数存在问题:操作数据的部分全部放在共同的父组件中兄弟之间传递数据需要借助共同的父组件,过于繁琐二、发布订阅机制用途:适用于任何组件之间的通信,避免了借助共同父组件用法:在需要接受数据的组件中订阅消息,传递数据的组件中发布消息(先订阅,再发布)。当订阅者和发布者订阅的消息名一
2021-02-23 22:25:57 626
原创 二、DOM中的diffing算法(Vue/React中绑定的key)
问题:Vue/React中绑定的key是什么?有什么作用?key是虚拟DOM对象的标识,在数据的更新显示中起到非常重要的作用。当页面中的数据发生变化时,react会根据“新数据”生成“新的DOM”,但是当数据只有部分发生变化时,React是否会一次性更新页面中的所有DOM呢?答案是否定的。那么React又是如何辨别哪些是重复DOM,哪些是“新的DOM”呢?此时利用的就是这个key值了。实现过程:若在旧虚拟DOM找到了与新虚拟DOM中相同的key:(1)若虚拟DOM中内容没变,则直接使用之
2021-02-23 16:00:36 189
原创 一、React初学笔记
一、React的特点采用组件化模式、声明式编码,提高了开发效率及组件的重复率在React Native中可以使用React语法进行移动端的开发使用虚拟DOM+Diffing算法,尽量减少与真实DOM的交互<body> <!-- 准备好一个容器 --> <div id="test"></div> <!-- react核心库 --> <script src="../js/react.developmen
2021-02-18 22:10:31 169
原创 java初学部分笔记
一、java的数据类型基本类型引用类型byte-1个字节、short-2个字节、int-4个字节、long-8个字节类float-4个字节、double-8个字节接口char-2个字节数组boolean-1位注意:java是强类型语言,其中float和long类型的变量在声明时,后面应加上F和L位:计算机内部数据存储的最小单位;字节:数据处理的基本单位1B(字节) = 8 bit(位)所有字符的本质是数字Unicode编码表:u0000-
2021-02-13 23:08:27 148
原创 Vue中关于子组件通过双向绑定时,利用props修改父组件中数据报错问题
Vue中关于子组件通过双向双向绑定props修改父组件中数据报错问题在官方文档中,不允许子组件直接通过双向绑定,修改props属性中的值,若要修改,则会报错解决方法:因为子组件的props属性绑定的是父组件中的data,当子组件直接通过双向绑定(props)来修改值时,相当于通过该属性直接修改了父组件中的data,该做法是不允许的因此实现双向绑定时,还是需要绑定data属性中的值:即首先将父组件的data值传给子组件中props的属性,然后在子组件中声明data属性,用props属性中的值初
2020-12-05 20:41:53 1028
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人