1. 程式人生 > >vue2.0 技巧匯總

vue2.0 技巧匯總

date const undefined die ++ 數據 brush vue exp

/**
 * Created by 
 */
export default {
    trim: (str) => { //刪除左右兩端的空格
        return str.replace(/(^\s*)|(\s*$)/g, "");
    },
//顯示當天的時間,超過一天顯示昨天,大於一天,顯示,星期,年 formatMessageTime: (time) => { const week = { "0": "星期日", "1": "星期一", "2": "星期二", "3": "星期三", "4": "星期四", "5": "星期五", "6": "星期六" }; const oneDay = 24 * 60 * 60 * 1000, oneWeek = 6 * 24 * 60 * 60 * 1000, oneYear = 365 * 24 * 60 * 60 * 1000; // return function (time) { if (!time) { return ‘‘; } if (typeof (time) === ‘string‘) { return time; } const sendTime = new Date(time), currentTime = new Date(); const yesterdayTime = new Date(currentTime.getFullYear(), currentTime.getMonth(), currentTime.getDate()); let minutes = sendTime.getMinutes(); let hours = sendTime.getHours(); minutes = minutes > 9 ? minutes : ‘0‘ + minutes; hours = hours > 9 ? hours : ‘0‘ + hours; const showSendTime = hours + ‘:‘ + minutes; let showDate; // 今天 if (sendTime >= yesterdayTime) { return showSendTime; } // 昨天 else if (sendTime >= yesterdayTime - oneDay) { showDate = ‘昨天‘; } // 一周內 else if (sendTime >= yesterdayTime - oneWeek) { showDate = week[sendTime.getDay().toString()]; } // 今年內 else if (sendTime.getFullYear() == currentTime.getFullYear()) { showDate = (sendTime.getMonth() + 1) + ‘/‘ + sendTime.getDate(); } // 本世紀 else if (sendTime.getFullYear().toString().slice(0, 2) == currentTime.getFullYear().toString().slice(0, 2)) { showDate = sendTime.getFullYear().toString().slice(2) + ‘/‘ + (sendTime.getMonth() + 1) + ‘/‘
+ sendTime.getDate(); } // else { showDate = sendTime.getFullYear() + ‘/‘ + (sendTime.getMonth() + 1) + ‘/‘ + sendTime.getDate(); } return showDate + ‘ ‘ + showSendTime; // }; }, formatTime: (time) => { var d = new Date(time); var year = d.getFullYear(); var month = d.getMonth() + 1; var day = d.getDate() < 10 ? ‘0‘ + d.getDate() : ‘‘ + d.getDate(); var hour = d.getHours(); var minutes = d.getMinutes(); var seconds = d.getSeconds(); // return year + ‘-‘ + month + ‘-‘ + day + ‘ ‘ + hour + ‘:‘ + minutes + ‘:‘ + seconds; return hour + ‘:‘ + minutes; } }

ctrl +enter 換行的獲取光標的函數:
placeCaretAtEnd(el) { el.focus(); if (typeof window.getSelection != "undefined" && typeof document.createRange != "undefined") { var range = document.createRange(); range.selectNodeContents(el); range.collapse(false); var sel = window.getSelection(); sel.removeAllRanges(); sel.addRange(range); } else if (typeof document.body.createTextRange != "undefined") { var textRange = document.body.createTextRange(); textRange.moveToElementText(el); textRange.collapse(false); textRange.select(); } },

 功能:根據id 查找id在數組的索引index
indexOfTargetId(id) { for (var i = 0; i < this.length; i++) { if (this[i].targetId == id) return i; } return -1; },

/*	formatMsgTime(time) {
			const week = {
				"0": "星期日",
				"1": "星期一",
				"2": "星期二",
				"3": "星期三",
				"4": "星期四",
				"5": "星期五",
				"6": "星期六"
			};
			const oneDay = 24 * 60 * 60 * 1000,
				oneWeek = 6 * 24 * 60 * 60 * 1000,
				oneYear = 365 * 24 * 60 * 60 * 1000;

			// return function (time) {
			debugger
			if (!time) {
				return ‘‘;
			}
			if (typeof (time) === ‘string‘) {
				return time;
			}
			const sendTime = new Date(time),
				currentTime = new Date();
			const yesterdayTime = new Date(currentTime.getFullYear(), currentTime.getMonth(), currentTime.getDate());

			let minutes = sendTime.getMinutes();
			let hours = sendTime.getHours();
			minutes = minutes > 9 ? minutes : ‘0‘ + minutes;
			hours = hours > 9 ? hours : ‘0‘ + hours;

			const showSendTime = hours + ‘:‘ + minutes;
			let showDate;
			// 今天
			if (sendTime >= yesterdayTime) {
				return showSendTime;
			}
			// 昨天
			else if (sendTime >= yesterdayTime - oneDay) {
				showDate = ‘昨天‘;
			}
			// 一周內
			else if (sendTime >= yesterdayTime - oneWeek) {
				showDate = week[sendTime.getDay().toString()];
			}
			// 今年內
			else if (sendTime.getFullYear() == currentTime.getFullYear()) {
				showDate = (sendTime.getMonth() + 1) + ‘/‘ + sendTime.getDate();
			}

			// 本世紀
			else if (sendTime.getFullYear().toString().slice(0, 2) == currentTime.getFullYear().toString().slice(0, 2)) {
				showDate = sendTime.getFullYear().toString().slice(2) + ‘/‘ + (sendTime.getMonth() + 1) + ‘/‘ 
+ sendTime.getDate(); } // else { showDate = sendTime.getFullYear() + ‘/‘ + (sendTime.getMonth() + 1) + ‘/‘ + sendTime.getDate(); } return showDate + ‘ ‘ + showSendTime; // }; }*/

右鍵功能 

@contextmenu.prevent="rightShow()"
v-on:contextmenu.prevent = "事件名稱"

數據的json和對象的轉換
1、console.log(JSON.stringify(json)); 2.JSON.parse()

1、顏色的漸變
background:-webkit-linear-gradient(left, #1290e9,#00d7da );
background: -webkit-linear-gradient(left, #1815e0 20%, #00d7da);
2、模態窗口如何使用

vue2.0 技巧匯總