vue3.0路由匹配
{
path: '/:pathMatch(.*)*',
name: '404',
component: () => import('../views/pages/404.vue'),
meta: {
requireAuth: false
}
}
js
当月开始/结束日期
/**
* @returns {string} 当月开始日期
*/
export function getCurrentMonthFirstDay() {
var date = new Date()
date.setDate(1)
var month = parseInt(date.getMonth() + 1)
var day = date.getDate()
if (month < 10) {
month = '0' + month
}
if (day < 10) {
day = '0' + day
}
return date.getFullYear() + '-' + month + '-' + day
}
/**
* @returns {string} 当月结束日期
*/
export function getCurrentMonthLastDay() {
var date = new Date()
var year = date.getFullYear()
var month = date.getMonth() + 1
month = month < 10 ? '0' + month : month
var day = new Date(year, month, 0)
return year + '-' + month + '-' + day.getDate()
}
时间格式(Moment.js 日期处理类库:momentjs.cn/)
Date有个toJSON方法,现在大部分环境都可用的。它的结果是类似
2017-02-18T22:33:48.322Z
距离YYYYMMDD格式最接近,但是toJSON没有根据时区打印,有个取巧的方法
let date = new Date();
date.setMinutes(date.getMinutes() - date.getTimezoneOffset()); // toJSON 的时区补偿
date.toJSON().substr(0, 13).replace(/[-T]/g, ''); //2017021822
把T和Z和毫秒去掉就正好是YYYY-MM-DD H:i:s
get请求加上时间戳
ajax请求如果和上次地址相同,就有可能直接读取缓存的内容,而不再次获取最新数据了。
所以可以再url地址后面加个变量-->目前时间 var timenow = new Date().getTime();
// url:"你的url地址?t="+timenow
// url:"地址?传递的数据+"&key="+timenow,
//设定一分钟更新一次时间戳
let timeStamp = `t=${parseInt(new Date().getTime()/(1000 * 60))}`;
if (config.url.indexOf('?') > -1) {
timeStamp = '&' + timeStamp; // 有参数
} else {
timeStamp = '?' + timeStamp; // 无参数
}
因为时间是在变的 ,所以你获取的url是不一样的
打印 github.com/xyl66/vuePl… blog.csdn.net/qq_37604640…
<!-- <iframe :src="iframeSrc" scrolling="auto" frameborder="0" id="iframe" class="printBox"></iframe> -->
document.getElementById('iframe').contentWindow.print() <style media="print">
// 获取子页面(调用子页面方法)
let fwin = document.getElementById("emrIframe").contentWindow;
// this.saveDisabled = true;
this.$store.commit('app/saveDisabled', true)
fwin.saveData();
// 去除页头页尾
@page {
size: auto;
margin: 0mm;
}
css
计算属性
width: calc(100% - 400px); 这里的意思是设置宽度比100%的宽度少20px。
不定高,文本溢出省略号,设置行数
display: -webkit-box;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
文本溢出隐藏
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
vue 过渡动画
不设置 name:v-enter ...
<transition name="你要的名字">
过渡的元素...
</transition>
你要的名字-enter 进入前效果
你要的名字-enter-active 进入的过渡时间和函数
你要的名字-enter-to 进入后效果
你要的名字-leave 离开前效果
你要的名字-leave-active 离开的过渡时间和函数
你要的名字-leave-to 离开后效果
2.0插件
输入框限制数字
<input maxlength="4" v-model="code" oninput="value = value.replace(/[^0-9]/g,'')" placeholder="请输入手机验证码">
build去除conlose
插件:babel-plugin-transform-remove-console
babel.config.js 文件中添加
let plugins = [];
if (process.env.NODE_ENV === "production") { // if判断是否打包,打包环境下控制台去掉console.log,也可去掉if判断,整个项目不会出现console.log(不建议)
plugins.push("transform-remove-console");
}
module.exports = {
presets: ["@vue/cli-plugin-babel/preset"],
plugins: plugins
};
移动端调试
下载:npm install vconsole
引入:import VConsole from 'vconsole';
初始化:new VConsole();