- 博客(26)
- 收藏
- 关注
RSS订阅原创 vuex的使用
2.2 通过导入MapMutations 函数实现 将MapMutations 函数 映射为组件的 methods 方法。1.2 引入mapState 通过计算属性的方式(通过计算属性将state 的数据映射为 data 中的数据)State 提供唯一公共数据源，所有的共享数据都要统一放到Store 的State 中存储。在store 新建modules 后在index 中引入 (分模块，业务多之后会更清晰)2 改变State 中的数据。前置条件 已安装有vuex。
2022-10-10 23:12:12
108
1
原创 uniapp Note
uniapp 获取某个标签距离顶部的距离（吸顶效果时常用到)onPageScroll(res) { uni.createSelectorQuery().in(this).select('.taps') .boundingClientRect(rect => { console.log('rect===>', rect); if(rect.top<=0){ this.fixedShow = true }else{ this
2022-05-03 17:40:26
185
原创 小程序签名组件
index.wxml<view class="wrapper" animation="{{ ami }}" wx:if="{{show}}"> <view class="handBtn"> <view class="pointers"> <view class="color-pointer {{selectColor === 'black' && 'active'}}" catchtap="selec
2022-02-15 15:41:01
696
原创 React配置代理解决跨域的两种方式
方式一 在package.json 文件中配置 "proxy":"http://localhost:5000"方式二 在src 目录下新建 setupProxy .js 文件 新建如下代码http-proxy-middleware的版本如果是1.x以上，需要这么写const { createProxyMiddleware } = require('http-proxy-middleware')module.exports = function (app) { app.use(cre
2022-01-04 17:30:47
716
原创 数组去重的一些方法
javaScript 版本Map 方式/** * @param {number[]} nums * @return {number} */ var testArr = [0 ,3 , 3 ,5 ,7 ,7 ,8]var removeDuplicates = function(nums) { const res = new Map(); return nums.filter((a)=>!res.has(a) && res.set(a,1))};var n
2021-12-11 14:45:36
407
原创 some fun_
/** * @desc 获取 WXML 节点信息的对象 * @param {*} selector 选择器 * @param {*} com 自定义组件的实例对象,如在组件内使用必传 * @returns {promise} */const getNodes = (selector, com) => { const query = com ? com.createSelectorQuery() : wx.createSelectorQuery() query.select.
2021-12-09 15:14:41
156
原创 简易的setData一个数据
做小程序的时候难免会遇到经常切换一个按钮或者某个组件的显示与隐藏，一般的写法是 绑定一个函数 去 this.setData({ show : true })只要有需要切换显示与隐藏的都需要这样写一遍。很麻烦 so…1 在utils 新建一个文件 pageDecorator.jsimport { deepMerge } from './index'function pageDecorator(params) { const originPage = Page Page = f
2021-12-09 15:05:14
453
原创 微信小程序中Echart 的使用
1 下载微信微信部的echart 小程序 （https://github.com/ecomfe/echarts-for-weixin）2 如果只是需要部分图表 可采用定制方式下载 减少小程序包的大小 (https://echarts.apache.org/zh/builder.html)3 最重要的地方是 官方给的小程序echart 的 数据是写在data 外面的 。我们挺难去动态修改数据可以采用如下方法 将 数据写在方法中 再数据setData 到data 中import *
2021-11-30 10:59:31
988
原创 微信小程序自定义评分小组件
大致逻辑是 使用两个标签 用第二行标签覆盖第一行的标签，其中第一行为未选中状态，第二行为点亮状态。再通过calc 根据传入的百分比计算第二行要显示的宽度，溢出隐藏。这样就可以实现评分点亮的状态，以及亮半星 或 亮3分之一等。如图一 把第红色那一行覆盖前一行如总评分为10分 当评分为8.4时 评分组件就显示如下红色行状态具体代码如下：<view class="um-rate"> <view class="rate-default" style="colum
2021-11-11 13:56:28
1073
原创 小程序中阿里图标的自定义使用
1 在阿里图标库中添加图标至自己的项目 点击复制代码 (黑色部分)2 在小程序项目目录新建公共样式文件 将复制的代码粘贴到公共样式中 如下图3 在app.wxss 中引入该公共样式@import './common/style/umfont.wxss';4 在components 中新建 um-icon(名字随便取)自定义组件。wxml代码如下：<text class="umfont icon-{{type}}" style="color:{{color}};font-si
2021-11-10 16:17:50
518
原创 根据时间区间算出每一天
1 如有时间 start = “2021-08-22” end = “2021-08-25”2 得 [“2021-08-22”, “2021-08-23”, “2021-08-24”, “2021-08-25”] formatEveryDay(start, end) { let dateList = []; var startTime = this.getDate(start); var endTime = this.getDate(end); whi
2021-08-20 14:53:42
230
原创 小程序中的节流
// wxml 代码：<input class='searchInput' value="{{keyWord}}" type="text" confirm-type="search" bindconfirm="searchIt" bindinput="inputValue"/>// 这种写法 bindconfirm 绑定的函数在点击软键盘右下角回车键时，触发 searchIt 函数// confirm-type="search" 写法，使右下角回车键显示为 ‘搜索’ js 代码：/
2021-08-09 11:36:24
624
原创 数组对象去重
1 判断一个数组对象里面是否存在某个值 存在更新，不存在新增/** * 判断数组对象中是否有某个对象，有则替换无则添加 * @param {*} initialArr 源数组 * @param {*} obj 判定的对象 * @param {*} pro 对象中的某个属性名（唯一，通常为id） */ formateArrObjData(initialArr, obj, pro){ let tempArr = initialArr; if (!(initialArr insta
2021-07-29 17:46:32
138
原创 BEM命名规范
先放官方文档：http://getbem.com/introduction/BEM 是英文 Blocks,Element and Modifiers 的缩写 （模块，元素，修饰符）命名方法：.block__element--modifier { display: flex;}.block--modifier { display: flex;}.block__element { display: flex;}<p class="header">
2021-05-19 23:40:59
87
原创 html2 canvas截图插件 的使用
先放官网链接 ：http://html2canvas.hertzen.com我是在vue2 中使用的，步骤如下1 npm 安装 npm install --save html2canvas2 在需要截图的页面中引入 import html2canvas from "html2canvas";3 截图是以dom 为节点去截图的如我需要截 以下整个节点<div ref="imageWrapper">4 在vue methods 中获取该节点 this.$refs.ima
2021-05-04 23:50:26
199
原创 vue-router的使用
1 创建项目1.1vue create demo在终端输入以上命令后选择手动创建配置通过上下箭头和空格选择需要的开发环境 如上我选择了 Router2 安装成功后 在main.js 中引入路由 （我这里用的vue3） import { createApp } from 'vue' import App from './App.vue' import router from './router' createApp(App).use(router).mount('#app') 3
2021-05-04 01:52:38
123
原创 veu3路由的安装和使用
1 npm install vue-router@4 （通过npm安装最新的路由）2 在package.json文件中看到如下版本信息表示安装成功3 在main.js中引入 如下图所示：4 使用：在components 创建随便创建几个.vue文件：for example：我创建的文件:4.1 创建好文件后 同时需要在src文件夹下（components同级）新建router文件夹，并在里面新建index.js文件。4.2 ：我的index.js 文件代码如下：import
2021-04-07 01:58:44
287
原创 倒置置换？？
功能需求 根据数字 显示对应的文字 如 0 显示 差 1 显示 一般<view>inversionStart[index]</view>data:inversionStart: {0: ‘很差’,1: ‘差’,2: ‘一般’,3: ‘满意’,4: ‘非常满意’,},
2021-03-15 11:33:19
95
原创 从vue导出Excel
今天碰到一个需求，客户需要把table表格可以导出为Excel保存到本地，之前也做过在线预览 下载word文档都是后台给接口。现在是直接把html 表格转为Excle 具体方法如下（实践可用）1 先安装两个依赖包1.1 npm install -S file-saver xlsx1.2 npm install -D script-loader2 在项目中新建一个文件夹vendor（名字随意，为了方便建议新建在需要导出为Excel组件的同级目录）2.1 下载两个文件 Blob.js和Expor
2020-09-28 17:23:42
115
原创 vue-cli打包路径不对以及更改icon图标
1 在路径下创建vue.config.js 文件。2 打包后路径不对添加 一下代码即可 publicPath: './',3 更改标题图标3.1 vue 的标题图标代码是在 public 文件的index.html 里面<link rel="icon" href="<%= BASE_URL %>favicon.ico">3.2 把需要更换的图标改为faicon.ico 替换原来的daicon.ico文件3.2 在vue.config.js文件里添加以下代码
2020-09-14 17:20:24
961
原创 echarts is not defined
关于echarts is not defined在vue中使用echarts的柱状图时遇到echarts is not defined 可能是因为路径的问题解决办法：1 把 color: new echarts.graphic.LinearGradient 改成 color: new this.echarts.graphic.LinearGradient2 在当前项目的当前页面中引入 import echarts from "echarts"附：echarts 在vue3中的使用方法1
2020-09-09 15:50:14
8196
1
原创 VUE 中 通过v-bind:src 图片不显示问题
VUE 中 通过v-bind:src 图片不显示问题，引入图片的方式用require 即可html: <img src="../../assets/images/ColdRain/u5865.png" />js: imgUrl:require( './../../assets/188.jpg'),
2020-09-05 10:32:17
2761
原创 node: command not found处理方法
今天配置java 环境的时候 把系统环境Path 误删了 导致命令行 git node 都使用不了。打node -v 显示 node: command not found…解决办法 重新配置环境变量 比如 我的node 安装在E盘的Program Files目录下 就添加如下配置：...
2020-08-11 16:37:01
4320
原创 swipe滑动插件使用碰到的问题
用Swiper 做轮播图的时候，把按钮替换成自己想要的图片的时候出现了一个小问题，每次鼠标点击的时候就会出现一个外围小方框，如下html代码：<div class="swiper-button-right swiper-button-next"> <img src="./images/right2.png"></div>解决办法：只需要给div 加上如下css代码div:focus { outline: none !important;}.
2020-08-02 23:17:49
191
原创 git提交代码到远程仓库 github
1 如果是第一次使用github 先配置一下ssh key第一步 在命令行中输入ssh-keygen -t rsa -C “你的邮箱”默认会在 /C/Users/Administrator/.ssh/id_rsa 生成三个文件把后缀名为.pub 用记事本打开 复制粘贴到github ->Settings->SSH and GPG keys->SSH keys...
2020-06-07 22:22:06
97
原创 ERROR in Entry module not found: Error
初学 webpack 打包工具的时候 在执行 npm run dev 遇到 ： ERROR in Entry module not found: Error: Can’t resolve ‘./src’ in… 错误 。原因是 webpack 的4.0x版本默认约定：1. 打包的入口文件为src -> index.js 2.打包的输出文件为dist -> main.js而我的src目录.js文件 不是index.js解决办法 1 把src目录.js文件 改成index.js
2020-06-06 15:03:33
1785
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人