- 博客(22)
- 收藏
- 关注
RSS订阅原创 在vue3中配置404路由
import NotFound from 'NotFound'const routes = [ { path: '/:catchAll(.*)', component: NotFound },]
2022-05-25 11:26:04
1135
原创 vue3组件通信
1.父传子propsParent.vue<template> 这里是父组件的数据:{{person}},{{arr.list}} <br> <Child :person="person" :list="arr.list"></Child></template><script setup lang="ts">/** * vue3的版本是3.2.3x(npm list vue 查看vue版本) * 这里在 scrip
2022-04-18 16:00:40
616
原创 在vue3进行网络请求到的数据如何赋值？
定义数组数据时,需要在外面包一层,否则直接赋值,数据不是响应式的setup() { let params = reactive({ pageNum: 1, pageSize: 3, }) // 定义数组数据时,需要在外面包一层,否则直接赋值,数据不是响应式的 const data = reactive({ list: [] }) test(params).then(res => { data.list
2022-04-13 10:39:00
6893
原创 react组件生命周期
一、认识生命周期任何事物从创建到销毁的过程，就是生命周期。二、生命周期执行过程2.1 Mounting当组件实例被创建并挂载 DOM 中时，其生命周期调用顺序如下：constructor()：在react组件挂载之前，会执行constructor构造函数render()：是 class 组件中唯一必须实现的方法componentDidMount()：当组件挂载到DOM中立即调用2.2 Updating每当组件的 state 或 props 发生变化时，组件就会更新，执行顺序如下
2022-01-20 11:31:21
680
原创 vue事件总线(EventBus)学习
一、背景我们知道,在vue组件之间传递数据有很多方式,如:父子组件通信,隔代组件通信,路由传参,vuex等等,但是此时我们有两个同级(或者毫无关系的)组件,即兄弟组件之间通信,我们应该怎么办?那我们可以采取事件总线(EventBus)的方式解决,当然上述的其他方法也是可以解决的.二、事件总线顾名思义,就是组件相同事件的集合,可以向这个集合里注入一些事件,同时其他组件可以从这个集合里接收事件,这样两个不相干的组件可以进行通信.三、具体代码1.新建bus.js文件代码如下:import Vue f
2022-01-13 16:31:52
437
原创 vue配置别名alias在webstorm不生效
今天在配置vue.config.js别名时,发现使用别名不生效,代码没有问题最后发现是在webstorm的webpack配置问题,将webpack开启自动即可注好像2019版本的webstorm没有自动的选项,只有已禁用和手动的选项,2020的版本不知道,我用的是2021版本是有这三个选项如果是没有自动选项的版本的webstorm.可以在本地新建一个js文件,代码如下,命名随意,放置的磁盘随意const path = require('path')module.exports = { c
2021-12-09 13:54:58
2436
原创 vue组件隔代通信(爷爷组件与孙子组件通信)
参考:https://blog.youkuaiyun.com/qq_39009348/article/details/819774681.方法:$attrs和$listeners两个属性看了官方文档对这两个属性的解释有点抽象,简单的的说$attrs属性可以可以获取顶层组件(爷爷组件)的值(这里的数据是data定义的,而props不可以);$listeners属性相当于顶层组件(爷爷组件)事件监听器首先我定义三个组件YEYE.vueBABA.vueSUNZI.vue最终效果2.将爷爷组件的值传给孙子
2021-12-07 13:48:55
11107
1
原创 vue循环el-button，点击哪个按钮，那个按钮变色
1. 场景有多个按钮，一个个的写并且一个个绑定事件代码很冗余，所以就循环，绑定一个事件，传不同的参数即可2. 实现我这里有两种button，由于一些原因，“全部”按钮没有放在循环里面data里面methods3. 效果...
2021-12-03 10:25:06
4433
原创 vue登录时滑块验证
1.效果图2. 新建 SliderCheck.vue组件<template><!-- 拖动验证--> <div class="slider-check-box"> <div class="slider-check" :class="rangeStatus ? 'success' : ''"> <i @mousedown="rangeMove" :class="rangeStatus ? successIcon : st
2021-12-01 16:05:16
1952
2
原创 vue登录时图形验证码
效果图：点击图案可以切换字符1.新建 Identify.vue 组件<template> <div> <canvas id="s-canvas" :width="contentWidth" :height="contentHeight"></canvas> </div></template><script>export default { name: "i
2021-12-01 15:54:33
444
原创 python爬虫获取img标签的 src属性
python爬虫获取img标签的 src属性1.已经可以拿到整个img标签的内容打印结果如下2.直接获取这样就可以获取src里面的内容了
2021-11-26 14:14:32
9916
1
原创 mpx-小程序开发框架
官方文档：https://didi.github.io/mpx/start.html一. 起步1.1 安装npm install @mpxjs/cli -g
2021-11-12 11:54:27
993
转载 淘宝 NPM 镜像站切换新域名啦
原文链接：https://developer.aliyun.com/article/801032?用CNPM/淘宝源的开发者们请注意，淘宝NPM 镜像站喊你切换新域名啦。新的Web 站点：https://npmmirror.com，Registry Endpoint：https://registry.npmmirror.com。随着新的域名已经正式启用，老 http://npm.taobao.org 和 http://registry.npm.taobao.org 域名将于 2022 年 05 月 31
2021-11-12 09:41:38
155
原创 小程序实现计算器
小程序实现简单计算器功能小程序框架：mpx，如果没接触过mpx框架可以参考官网 https://didi.github.io/mpx/前端技术：小程序，js，scss效果图js部分1.我在这里点击等于号的时候进行判断，如果输入的公式结尾是以符号结尾的，那么就不允许计算，提示错误注意：小程序不允许使用eval()函数,解决方法可自行百度2.点击其他按键的时候也进行了判断不能连续输入两个运算符一个数字只能有一个小数点因为业务需要，没有负数计算，所以公式首位不能是负号我是在watc
2021-11-11 11:32:04
2221
1
原创 vue-router使用
一、vue-router基本使用二、vue-outer嵌套路由三、vue-router参数传递四、vue-router导航守卫五、keep-alive
2021-10-18 16:16:41
11231
4
原创 vueX状态管理
1. 安装vuex1.1 使用vue-cli新建项目时,可以选择是否安装vuex;选择vue-cli安装项目完成后,在目录结构中会自动生成 store文件夹,里面自动生成index.js文件1.2 使用npm安装vuex安装命令:npm install vuex -s在src目录下新建store文件夹,然后再该文件夹中新建index.js文件初始化index.js内容将store挂载到vue实例中打开main.js,添加如下内容然后就可以在组件中使用vuex了.
2021-09-24 16:27:44
144
原创 数组常用方法
一、数组1.将数组转化为字符串1.1 toString()let nameArr = ['张三','李四','王五'];let names = nameArr.toString();console.log(names) // 张三,李四,王五1.2 join()**join()**与toString()功能类似,但是可以规定以何种分隔符来分割数组 let nameArr = ['张三', '李四', '王五']; let names = nameArr.join('@'); conso
2021-08-18 15:20:15
196
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人