- 博客(58)
- 收藏
- 关注
原创 前端打印(不使用插件,没有副作用)
今天要写一个打印,以前写过是直接调用window.print() ,因为之间是点击预览,跳转页面,打印,所以也没发现有什么副作用,今天,打印是在当前页打印局部,网上部分方法说,打印前把body赋值成局部元素,打印后复原,我发现这样会让打印之后,页面点击事件失效。但是我找到一个无副作用的,是在取到全局dom,后把自己不需要的元素给隐藏掉,然后打印,因为拿到dom后赋值给了变量,直接操作变量,所以也不会影响原页面, 还可以自定义打印时候,打印样式,代码如下。然后打印页面引入使用一下,下面是你的打印页面的代码。
2024-03-24 17:24:44
393
原创 vue3一些(要命)注意点(持续跟新此文章)
1.从reactive包裹的对象里解构出来的值(子项)不具备响应式,要想让结构出来的值具有响应式需要在解构时候用toref包裹.2.如果reactive包裹的对象里包含的某些子项同时还被ref包裹,那么取这些子项值得时候,不需要.value。
2024-02-04 10:28:38
488
原创 readonly跟shallowreadonly(vu3)
当你不想让别人修改你的数据,你可以在setup中用readonly包裹,shallowreadonly可以让你写的对象的第一层不被修改 用法如下。readonly跟shallowreadonly。
2023-06-03 16:08:52
202
原创 shallowRef跟shallowReactive(vue3)
但是shallowRef只能处理简单数据类型,不能处理复杂数据类型做响应式。shallowReactive只能让复杂数据类型的第一层做到具有响应式。ref主要是处理简单数据类型,实现响应式,也可以处理复杂数据类型。说这两就得先说说ref跟reactive。reactive只可以处理复杂数据类型。
2023-06-03 15:59:52
192
原创 toRef和toRefs(vue3)
用了toRef,你可以简化在模板中对数据的使用(千万不可以不用toRef直接在setup中使用简化,不会生效的,因为不用的话,你只是吧初始值赋给你retun的数据,不会有响应式)toRefs就是可以直接简化,一个对象,例如。可以把一个不是ref的对象变成ref。toRef和toRefs。看不懂就直接看例子吧。
2023-06-03 15:51:26
141
原创 vue2 watch 监听对象中的某一个子项
除了用deep,去监听外,这里说一下单独监听对象中的一个值 watch:{ '对象名字.对象下的字段名字'(val,old){ console.log(val) } },搞定,收工
2022-05-18 15:50:12
1098
原创 avue-crud 根据别的字段的值,控制别的个字段在弹窗要不要显示
option: { column: [ { label: "会见形式", prop: "meetType", type: "select", editDisabled: true, dicData: [ { label: "现场会见", value: "1", ..
2022-05-10 15:31:40
2243
7
原创 avue-crud自己调起编辑弹窗
在avue-crud,标签内自己写一个操作栏的按钮,通过 handleEdit() <template slot-scope="scope" slot="menu"> <el-button type="text" icon="el-icon-edit-outline" size="small" v-if="scope.row.meetType == '1' || scope.row.mee.
2022-05-10 13:18:53
3707
2
原创 avue自定义合计方法
<avue-crud :data="tableData" :option="tableOption" :summary-method="summaryMethod" ></avue-crud> //以下的方法代码写在methods中,此合计方法接受两个值,columns是列信息,data是行信息 summaryMethod({ columns, data }) { const sum.
2022-04-17 15:21:37
1880
原创 前端获取明天,后天等的日期和星期几
废话不多说直接上代码 // 获取明天后天什么日期 GetDateStr(AddCount) { var dd = new Date(); dd.setDate(dd.getDate() + AddCount); //获取AddDayCount天后的日期 var y = dd.getFullYear(); var m = dd.getMonth() + 1; //获取当前月份的日期 var d = dd.getDate();
2022-04-16 19:39:00
1598
1
原创 htmlWebpackPlugin.options.title
vue项目中当你去index.html配置标题名,看见以下这些,可用下面去修改<title><%= htmlWebpackPlugin.options.title %></title>vue-cli3脚手架的项目下,在根目录的vue.config.js中添加如下代码 chainWebpack: config => { config .plugin('html') .tap(args => { args[
2022-03-29 18:39:23
4741
原创 Command vue init requires a global addon to be installed. Please run undefined @vue/cli-init and ..
用 vue init webpack '项目名称'报错下载一下这个依赖就可以npm install -g @vue/cli-init然后就可以可以了
2022-03-28 14:58:20
1224
原创 Avue-crud(字典用法)根据后端返回的字段的prop,去改变前端的展示
废话不多说上代码 option: { menuWidth: 500, align: "center", viewBtn: true, column: [{ label: "状态", type: 'select', //控制在显示或者编辑的时候显示该字段为下拉框 prop: "isAuth", //以下为字典的配置项,你可以动态获取字典然后赋值给它
2022-03-21 15:00:44
2054
原创 Avue-crud根据后端返回的字段的prop,去改变前端的展示
举个例子:如果你在使用avue 的 avue-crud 组件,现在呢后端返回给你一个性别(sex)的字段,如果是男该字段值1,如果是女该字段值是2,你是不是无从下手,你总不能给客户展示1跟2吧废话不多说,上代码 <avue-crud :data="data" :option="option" @row-save="rowSave" @row-update="rowUpdate" @row-del="rowDel" .
2022-03-18 17:55:26
1924
原创 微信小程序循环
在微信小程序里循环用,可以通过for-item去给循环得项起别名,当你的循环项为唯一的数字或者字符得时候,你可以用*this去代替<view wx:for="{{数组}}" wx:for-item="i" wx:key="*this"><view wx:for={{i[字段名]}} wx:for-item="j" >{{j.XXX} </view></view>...
2022-03-18 16:38:34
4018
原创 node中module.exports的导入导出
1.单个导出导入导出 : module.exports = 导出名称导入 : const 接受名称 = require("../../utils/xxx.js");2.多个导出导入(1)导出 : module.exports.导出1 = 导出1module.exports.导出2 = 导出2(2)导出module.exports={导出1 : 导出1导出2 : 导出2}导入 :{导出X} = require("../../utils/xxx.js").
2022-03-15 14:42:05
1891
原创 小程序使用vant tabs ,标题选中标识符错误,显示有偏差
出现这个情况应该是,你的标题是循环出来的,问题出现的原因是 Tab 挂载的时候会初始化并获取自身宽度,如果处于隐藏状态下,Tab 是获取不到自身宽度的,因此底部条的位置没法正确计算。你在你获取到标题的方法之后执行一句 this.selectComponent('#tabs').resize();...
2022-03-14 11:42:15
1002
原创 小程序实现 tab切换,点击tab 内容滚动切换
tab栏代码,点击那个高亮那个是通过 scroll-into-view 这个属性去实现的<scroll-view class="tui-city-scroll container" scroll-x="true" scroll-into-view="NAV{{status}}" scroll-with-animation="true"> <text bindtap="getStatus" id="NAV{{index}}" class="tui-nav-li {{index
2022-03-07 17:03:04
649
原创 小程序点击事件失效
开发过程突然发现,事件莫名其妙的失效,什么问题也查不出来,轮播图等其他功能正常其实这是官方的一个 bug , 这样子解决的就可以了给app.js里面的 wx.relaunch()加一个延迟setTimeout(()=>{ wx.reLaunch({ url:url }) },200)...
2022-02-22 14:14:02
1677
原创 Component “pages/index/index“ does not have a method “goEntryExitRecord“ to handle event “tap“.
遇到这个问题就是,你的方法加参数没加对这样改一下就可以了,在你需要添加点击事件的标签上面加上下面的代码data-?=? (第一个问好是你传参的名字,第二个问号是你传参的值)
2022-02-08 10:08:57
10635
1
原创 微信小程序swiper指示点样式修改
在你的.wxml文件里面 找到你的<swiper></swiper> 添加一个你喜欢的类名 像这样 <swiper class="lunbo" indicator-dots="{{indicatorDots}}" ></swiper>然后在对应的.wxss文件 里面粘贴我的代码 注释已经写好/*轮播图指示点*/.lunbo .wx-swiper-dots.wx-swiper-dots-horizontal{ margin-bo.
2022-02-02 10:49:25
1248
原创 微信小程序实现规划路线
背景: 我们是要实现,首先把一个具体的位置标记在地图上,点击规划路线之后,可以将当前位置到标记位置形成一条路线首先配置一下app.json "plugins": { "routePlan": { "version": "1.0.18", "provider": "wx50b5593e81dd937a" } }, "permission": { "scope.userLocation
2022-01-27 11:38:20
3397
2
原创 前端转换时间格式
1.以下方法可以直接挂载到,Date() 原型上,也可以自己封装成一个方法,那个组件使用就在那个组件引入,调用以下以在vue中挂在到Date()原型上为例Date.prototype.format = function (format) { var o = { "M+": this.getMonth() + 1, //month "d+": this.getDate(), //day "h+": this.getHours(), //hour
2022-01-13 16:05:19
5118
原创 vue处理后端导出接口(后端返回的是文件流)
废话不说上代码,直接把下方代码CV到你的导出按钮的逻辑就可以如果需要修改下载后的文件名字跟格式,修改fileName就可以,提示信息我用的是element,可以自行更换其他this.$http({ method: "post", responseType: "blob", //防止返回乱码 url: "/api/huilan-accommodation/stayInfomation/exportExcel", }).then((res)
2022-01-13 11:27:12
1247
1
原创 vue在浏览器控制栏中隐藏自己的源文件
现在 项目中安装 npm i --save uglifyjs-webpack-plugin在 vue.config.js里面配置引入const UglifyPlugin = require("uglifyjs-webpack-plugin");配置module.exports = { publicPath: "./", lintOnSave: false, //设置是否在开发环境下每次保存代码时都启用 eslint验证。 configureWebpack: (confi...
2022-01-06 17:11:19
1341
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人