utils/util.js
// 格式化時(shí)間
const timeLength = (value) => {
if (!value) return ''
let result = parseInt(value)
let h = Math.floor(result / 3600) < 10 ? '0' + Math.floor(result / 3600) : Math.floor(result / 3600);
let m = Math.floor((result / 60 % 60)) < 10 ? '0' + Math.floor((result / 60 % 60)) : Math.floor((result / 60 % 60));
let s = Math.floor((result % 60)) < 10 ? '0' + Math.floor((result % 60)) : Math.floor((result % 60));
let res = '';
if (h !== '00') res += `${h}:`;
res += `${m}:${s}`;
return res;
}
module.exports = {
timeLength
}
index.vue
<span v-if="xinzeng == 1" class="tips timeLength">(視頻時(shí)長(zhǎng)：{{timeLength(time_length)}})</span>
import { timeLength } from '../../../utils/util';
以上用法會(huì)出現(xiàn)報(bào)錯(cuò)：Property or method "timeLength" is not defined
原因：
雖然vue組件中HTML，css凸郑，js可以在同一個(gè)頁(yè)面書(shū)寫(xiě)，但是js里面的函數(shù)、變量是需要使用export default{ }拋出之后html才能使用的逊移。
解決方法：
需要在methods里面再聲明一下這個(gè)方法
methods: {
timeLength, // import進(jìn)來(lái)需要重新聲明一下才能在html中使用
}
重新定義一個(gè)方法，在這個(gè)方法里面使用它
<span v-if="xinzeng == 1" class="tips timeLength">(視頻時(shí)長(zhǎng)：{{formatTime(time_length)}})</span>
formatTime(val){
return timeLength(val)
},
image.png
