- 博客(28)
- 收藏
- 关注
RSS订阅原创 vue 父传子,传多次之后,最后一次传的数据传不过去，爬坑
我比较喜欢在父组件中使用索引直接更新数组项，或者修改对象的属性，试了几次后发现数据必须强制更新才行，用splice直接替换数据解决。这个问题可能是由于Vue的响应式系统在处理数据时出现了问题，导致最后一次传递的数据没有被正确更新。的属性时，它们必须是响应式的，这意味着它们必须在Vue实例创建时就存在。如果你在父组件中使用索引直接更新数组项，或者修改对象的属性，可能会导致问题。如果可能，尽量避免直接修改数组索引或对象属性，而是使用Vue的响应式方法，如。数据是对象或数组，在Vue中，对象和数组作为。
2024-08-19 14:05:53
181
原创 Vue为什么组件销毁后定时器会继续
如果我们没有在组件的生命周期方法中手动清除定时器，在组件被销毁后，该定时器仍然会继续运行，并且由于此时组件实例已经不存在于页面中，虚拟 DOM 无法监测到定时器的状态变化。当我们在 Vue 组件中创建定时器时，实际上是在组件的生命周期方法（例如 mounted ）中注册了该定时器。这意味着，在组件被销毁时，虽然页面上已经看不到该组件，但是组件实例却还存在于内存中，而其中包括已经注册的定时器。当一个对象不再被引用时，它仍然可能在内存中保留一段时间，直到垃圾回收机制判断它不再可达时才会被回收。
2023-05-31 10:07:07
1153
原创 element-ui的el-table动态修改表格展示列，table高度变小问题
element-ui的el-table动态修改表格展示列，table高度变小问题
2022-12-26 17:32:46
618
原创 echarts 流程图
先附图：代码如下：let myCharts = echarts.init(document.getElementById("techCharts")); let charts = { nodes: [ // 节点 {name: '流程1',value: [0, 500]}, {name: '流程2',value: [150, 500]}, {name: '流程3',value: [300...
2022-04-22 10:48:58
6265
8
原创 vue 鼠标滚轮上下滑动时div左右滑动
<template><div ref="scrollContainer"@mousewheel="MouseWheel"></div></template>对应的MouseWheel方法MouseWheel(e){leteventDelta=-e.wheelDelta||-e.deltaY*40;let$scrollWrapper=this.$refs.scrollContainer...
2020-11-09 18:41:04
1364
1
原创 vue html页面中部分div转pdf
通过html2canvas先将html转化为canvas,再通过canvas.toDataURL将canvas转化为图片main.js中import htmlToPdf from '@/components/utils/htmlToPdf'Vue.use(htmlToPdf)vue文件中<template><button type="primary" @click="getPdf()">保 存</button><div id="pdfD.
2020-09-09 11:00:43
758
原创 JSZip，saveAs压缩保存文件
// 使用 require 引入 jsziplet JSZip = require("jszip");// 引入另一个 file-saver 库，用来把压缩好的文件保存到本地let saveAs = require('file-saver');具体操作：var zip = new JSZip();var img = zip.folder("images"); //压缩包里建images目录//文件名需加后缀，如1.jpg，图片的base64格式要去掉data:image\/(pn.
2020-09-09 10:44:53
2032
原创 js 调取后台接口下载文件(get和post方式)
1.GET方式,通过原生js创建一个a标签，执行a标签的点击事件 let str = url+params; //url为接口地址，params为参数 let aLink = document.createElement('a') aLink.style.display = 'none' aLink.href = url document.body.appendChild(aLink) aLink.click() doc...
2020-09-09 10:30:01
3705
原创 element-ui el-image 第一次加载图片失败，第二次不刷新的问题
最近使用elementUI的el-image发现经常会出现加载src失败的情况，问题估计就是el-image的src路径一旦初始化加载失败的话就没有异步刷新，有两个解决办法：1.给:src设置默认值，避免图片加载失败的情况2.加v-if判断:src中的value值是否为空或者:src的key值是否存在，是则加载图片，否则不加载...
2020-09-03 18:14:38
4699
原创 iview表单验证一致提示为空
明明填了数据依然提示是空的，可能原因如下：1.type指默认为string，如果填写数字，则依然会提示为空，方法是在表单验证规则处加type 如{ required: true, message: '年龄不能为空', trigger: 'blur',type:'number' }2.确认如下填写正确，注意，只能是:model和:rules，不能是v-model3.官网上给的例子中没有v-model，其实是有错的，应该加上v-model而不是:model，如果不加表示原先的值没有变化，这样就.
2020-06-02 11:29:17
1300
3
原创 es6关于类
1.必须有构造方法，即使不写，也默认会有constructor方法是类的默认方法，通过new命令生成对象实例时，自动调用该方法。一个类必须有constructor方法，如果没有显式定义，一个空的constructor方法会被默认添加。class Point {}// 等同于class Point { constructor() {}}2.类的数据类型就是函数，类本身就指...
2019-10-10 17:34:34
147
原创 css布局居中方式汇总
1.水平居中 （1)文本水平居中： text-align:center； （2块级元素水平居中(定宽)：width:300px;margin:0 auto; (3)块级元素水平居中(不定宽)：给父元素设置text-align:center;2.垂直居中 (1)子元素是行内元素，其高度由父元素撑开：height:200px;line-height:2...
2019-09-29 14:29:55
134
原创 微信小程序文件预览(doc、ppt、pdf)
wx.downloadFile({url: filePath, //文件路径header: {},success: function (res) {console.log(res)var filePath = res.tempFilePath;console.log(filePath);wx.openDocument({filePath: filePath...
2019-04-22 11:23:14
14904
原创 微信小程序实现图片上传
wx.chooseImage({count: 1, //即一张sizeType: ['compressed'], // original 原图，compressed 压缩图，默认二者都有sourceType: ['album', 'camera'], // album 从相册选图，camera 使用相机，success: function (res) {that....
2019-04-22 11:19:43
4981
原创 小程序中图片预加载
首先打开https://github.com/o2team/wxapp-img-loader1、将 img-loader 目录拷贝到你的项目中 ，我拷贝在utils目录下，一下引入路径根据你存放img-loader目录的路径做适当变换2、在页面的 WXML 文件中添加以下代码，将组件模板引入<import src="../../utils/img-loader/img-loade...
2019-03-15 15:52:15
2622
原创 微信小程序识别html代码
通过接口获取到的数据，是用富文本编辑器写成的有html标签的格式，实现在小程序中识别html代码1.从该网址上下载wxParse文件夹，放入小程序中，路径自选https://github.com/icindy/wxParse 2. 在使用的View中引入WxParse模块 var WxParse = require('../../wxParse/wxParse.js');3.在...
2018-11-20 18:11:13
4061
原创 微信小程序 返回上一页面时实现上一页面刷新
假如从页面B返回页面A时实现页面A刷新页面B：var pages = getCurrentPages();//当前页面栈if (pages.length > 1) {var beforePage = pages[pages.length - 2];//获取上一个页面实例对象var currPage = pages[pages.length - 1]; // 当前页面，若不...
2018-10-24 16:31:54
16253
4
原创 redux ,react-redux
Redux 是「React 全家桶」中极为重要的一员，它试图为 React 应用提供「可预测化的状态管理」机制。Redux 本身足够简单，除了 React，它还能够支持其他界面框架。所以如果要将 Redux 和 React 结合起来使用，就还需要一些额外的工具，其中最重要的莫过于 react-redux 了。react-redux 提供了两个重要的对象， Provider 和 connect ...
2018-09-06 09:55:40
113
原创 vuex(多用于不同页面之间的数据共用和修改)
之前一直不理解vuex用于哪些方面，现在了解了，其实就类似于不同页面之间的传值，以前我们会用？key=value通过地址栏来传值，当然在vue中也可以通过地址栏传值，而现在我们也可以通过vuex来做数据传递和修改，其实就是把store当做一个仓库，当一个页面的值改变时，另一个页面的这个值也相应改变，而这个值的修改，是在store中统一做修改的。例子如下：该例子是略过actions直接让组件调用...
2018-08-24 09:56:12
18123
5
原创 vue组件间传递(多用于同一页面组件之间)
1.父组件传递数据给子组件父组件中：parent.vue<child :city="北京"></child>子组件中接收city:child.vueprops:{city:String} 2.子组件传值给父组件子组件中:child.vue子组件script中：this.$emit("name"，“李白”)父组件中:parent.vue&...
2018-08-24 09:30:11
1088
转载 webpack+vue-cil 中proxyTable配置接口地址代理
在项目开发的时候，接口联调的时候一般都是同域名下，且不存在跨域的情况下进行接口联调，但是当我们现在使用vue-cli进行项目打包的时候，我们在本地启动服务器后，比如本地开发服务下是 http://localhost:8080 这样的访问页面，但是我们的接口地址是 http://xxxx.com/save/index 这样的接口地址，我们这样直接使用会存在跨域的请求，导致接口请求不成功，因此我们需要...
2018-08-21 17:27:04
472
原创 TortoiseGit提交项目到GitHub（git可视化界面用法）
安装完TortoiseGit后，可以从电脑启动项看到双击它，点击Generate生成密钥，生成后，点击保存（ppk文件），保存位置自选，但自己一定要记得，我保存到了桌面，注意：此时先不要关闭该页面从已经登陆的github官网上title随意，将生成的密钥粘贴到Key下的文本框中，点击添加添加仓库复制这个SSH地址在一空白目录下，右...
2018-08-13 15:35:10
2078
原创 nodejs multiparty 文件上传
var multiparty = require('multiparty');function fileUpload(req,res) { //生成multiparty对象，并配置上传目标路径 var form = new multiparty.Form({uploadDir: '../static/images/'}); //上传完成后...
2018-08-13 10:24:29
1608
1
原创 vue中引入layer.js出错
之前学vue的时候，想引用layer插件，按照网上的步骤，先引入jquery，再引入layer.js，结果报错后来我在index.html页面全局引入，就可以了一个小坑，分享一下！ ...
2018-08-10 14:22:45
4190
2
原创 python发送短信验证码（互亿无线）
# coding:utf8#接口类型：互亿无线触发短信接口，支持发送验证码短信、订单通知短信等。#账户注册：请通过该地址开通账户http://sms.ihuyi.com/register.html#注意事项：#（1）调试期间，请用默认的模板进行测试，默认模板详见接口文档；#（2）请使用APIID（查看APIID请登录用户中心->验证码短信->产品总览->APIID）及 ...
2018-05-09 13:36:48
2015
1
原创 基于ECharts.js的条形和折线混合统计图
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div class="mui-input-group&q
2018-05-08 21:51:28
1141
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人