【vue】vue +element 搭建项目，将js函数变成vue的函数

/** * 将时间转换成时间戳 * @param DateTime 为时间格式下的时间 2018/06/14 13:00:00或2018-06-14 13:00:00 * @returns {number} * @constructor */let DateToUnix = function (DateTime) { ???var oDate = new Date(Date.parse(DateTime.replace(/-/g, "/"))); ???var Unix = oDate.getTime(); ???return Unix;}let DeCa = function (Natural) { ???var NaturalNum; ???if (Natural < 10) { ???????NaturalNum = "0" + Natural; ???} else { ???????NaturalNum = Natural; ???} ???return NaturalNum;}/** * 将时间戳转化为时间 * @param UnixTime 时间 格式 2018/06/14 13:00:00 * @param ShowTime 时间展示格式 选择 2018/06/14 13:00:00或2018-06-14 13:00:00等等格式 * @constructor */let UnixToDate = function (UnixTime, ShowTime) { ???var ToUnix = new Date(UnixTime); ???var Years = ToUnix.getFullYear();//获取年 例子：2018 ???var Month = ToUnix.getMonth() + 1;//获取月(0-11,0代表1月) ???var Day = ToUnix.getDate();//获取日（0-31） ???var Week = ToUnix.getDay();//获取星期（0-6；0代表星期天） ???var Hours = ToUnix.getHours();//获取小时（0-23） ???var Minutes = ToUnix.getMinutes();//获取分钟（0-59） ???var Seconds = ToUnix.getSeconds();//获取秒 ???var DaTime; ???if (ShowTime == 2) { ???????DaTime = Years + "/" + DeCa(Month) + "/" + DeCa(Day) + " " + DeCa(Hours) + ":" + DeCa(Minutes) + ":" + DeCa(Seconds); ???} else if (ShowTime == 3) { ???????DaTime = Years + "年" + DeCa(Month) + "月" + DeCa(Day) + "日 " + DeCa(Hours) + ":" + DeCa(Minutes) + ":" + DeCa(Seconds); ???} else if (ShowTime == 4) { ???????DaTime = Years + "年" + DeCa(Month) + "月" + DeCa(Day) + "日"; ???} else if (ShowTime == 5) { ???????DaTime = Years + "/" + DeCa(Month) + "/" + DeCa(Day); ???} else if (ShowTime == 6) { ???????DaTime = Years + "-" + DeCa(Month) + "-" + DeCa(Day); ???} else if (ShowTime == 7) { ???????DaTime = DeCa(Hours) + ":" + DeCa(Minutes) + ":" + DeCa(Seconds); ???} else if (ShowTime == 8) { ???????DaTime = DeCa(Hours) + "时" + DeCa(Minutes) + "分" + DeCa(Seconds) + "秒"; ???} else if (ShowTime == 9) { ???????DaTime = "星期" + Week; ???} else if (ShowTime == 10) { ???????DaTime = NumBerToHanZi(Years) + "年" + NumBerToHanZi(Month) + "月" + NumBerToHanZi(Day) + "日 星期" + NumBerToHanZi(Week); ???} else if (ShowTime == 11) { ???????DaTime = Years + "-" + DeCa(Month) + "-" + DeCa(Day) + " " + DeCa(Hours) + ":" + DeCa(Minutes) + ":" + DeCa(Seconds) + " 星期" + Week; ???} else if (ShowTime == 12) { ???????DaTime = Years + "/" + DeCa(Month) + "/" + DeCa(Day) + " " + DeCa(Hours) + ":" + DeCa(Minutes) + ":" + DeCa(Seconds) + " 星期" + Week; ???} else if (ShowTime == 13) { ???????DaTime = Years + "年" + DeCa(Month) + "月" + DeCa(Day) + "日 " + DeCa(Hours) + "时" + DeCa(Minutes) + "分" + DeCa(Seconds) + "秒 星期" + Week; ???} else { ???????DaTime = Years + "-" + DeCa(Month) + "-" + DeCa(Day) + " " + DeCa(Hours) + ":" + DeCa(Minutes) + ":" + DeCa(Seconds); ???} ???return DaTime;}//将阿拉伯数字转换成汉字let NumBerToHanZi = function (Numbers) { ???var strIns, chnStr = ‘‘; ???var chnNumChar = ["零", "一", "二", "三", "四", "五", "六", "七", "八", "九"]; ???while (Numbers > 0) { ???????var v = Numbers % 10; ???????strIns = chnNumChar[v]; ???????chnStr = chnNumChar[v] + chnStr; ???????Numbers = Math.floor(Numbers / 10); ???} ???return chnStr;}// 计算时间差let DownTime = function (EndTime) { ???//如果为时间戳 ???var EndTimes = new Date(EndTime).getTime();//结束时间 ???var NowTime = new Date().getTime();//当前时间 ???var DeltaT = EndTimes - NowTime; ???//计算出相差天数 ???var days = Math.floor(DeltaT / (24 * 3600 * 1000)); ???//计算出小时数 ???var leave1 = DeltaT % (24 * 3600 * 1000); ???var H = Math.floor(leave1 / (3600 * 1000)); ???//计算相差分钟数 ???var leave2 = leave1 % (3600 * 1000); ???var M = Math.floor(leave2 / (60 * 1000)); ???//计算相差秒数 ???var leave3 = leave2 % (60 * 1000); ???var S = Math.round(leave3 / 1000); ???var reminder; ???if (DeltaT > 0) { ???????if (days != "") { ???????????reminder = days + "天 " + H + "小时 " + M + " 分钟" + S + " 秒"; ???????} else if (days == "" || H != "") { ???????????reminder = H + "小时 " + M + " 分钟" + S + " 秒"; ???????} ???} else { ???????reminder = "请注意！时间到了！"; ???} ???return reminder;}export { DateToUnix, UnixToDate, NumBerToHanZi, DownTime }

import { DateToUnix, UnixToDate, NumBerToHanZi, DownTime } from ‘@/prototypefns/jsTime/datatime‘;export default{ ???install (Vue,options) { ???????/*时间转换器*/ ???????Vue.prototype.dateToUnix = DateToUnix;//转换时间戳 ???????Vue.prototype.unixToDate = UnixToDate;//转换时间 ???????Vue.prototype.downTime = DownTime;//倒计时 ???????Vue.prototype.numBerToHanZi = NumBerToHanZi;//转汉字 ???}}

import util from ‘@/prototypefns/util‘Vue.use(util);

 <!-- ???des:将js函数变成vue的函数 ?--><template> ???<div class="app-container "> ???????<div class="input"> ???????????<input type="text " value="2018-06-15 11:23:39"> ???????????<span class="input-btn" @click="toUnix">转换时间戳</span> ???????????<span v-text="unixTime"></span> ???????</div> ???????<div class="input"> ???????????<input type="text " ?value="1529033019000"> ???????????<span class="input-btn" @click="toDate">转换时间</span> ???????????<span v-text="dateTime"></span> ???????</div> ???????<div class="input"> ???????????<input type="text " ?value="2018/12/12 23:59:59"> ???????????<span class="input-btn" @click="toDownTime">倒计时</span> ???????????<span v-text="downTimeRes"></span> ???????</div> ???????<div class="input"> ???????????<input type="text " ?value="123456789"> ???????????<span class="input-btn" @click="toHanZi">转汉字</span> ???????????<span v-text="hanZi"></span> ???????</div> ???</div></template><script> ???export default { ???????data() { ???????????return { ????????????????requestData: [{ ???????????????????"id": "2", ???????????????????"name": "JAVA", ???????????????????"parentid": "0", ???????????????????"order": "2", ???????????????}], ???????????????requestJson:‘‘, ???????????????unixTime:‘‘, ???????????????dateTime:‘‘, ???????????????downTimeRes:‘‘, ???????????????hanZi:‘‘ ???????????} ???????}, ???????created(){ ???????????this.requestJson = this.json2html(this.requestData); ???????}, ???????methods: { ???????????toUnix(){ ???????????????this.unixTime = this.dateToUnix(‘2018-06-15 11:23:39‘); ???????????}, ???????????toDate(){ ???????????????this.dateTime = this.unixToDate(Number(‘1529033019000‘)); ???????????}, ???????????toDownTime(){ ???????????????this.downTimeRes = this.downTime(‘2018/12/12 23:59:59‘); ???????????}, ???????????toHanZi(){ ???????????????this.hanZi = this.numBerToHanZi(‘123456789‘); ???????????} ???????}, ???}</script><style> ???.input{ ???????display: flex; ???} ???.input-btn{ ???????display: block; ???????background: red; ???????color: #fff; ???????font-size: 12px; ???????height: 20px; ???????line-height: 20px; ???????width: 100px; ???????text-align: center; ???????cursor: pointer; ???????margin: 0 50px; ???}</style>