util.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
export default {
install(Vue) {
Vue.prototype.$empty = val => {
if (val === null || val === undefined) return true;
if (typeof === 'string' && val.trim() === '') return true;
if (Array.isArray(val) && val.length < 0) return true;
if (typeof val === 'object' && val.constructor.name === 'Object' && Object.keys(val).length < 1 && Object.getOwnPropertyNames(val) < 1) return true;
if (typeof val === 'object' && val.constructor.name === 'String' && Object.keys(val).length < 1) return true;
return false;
};
Vue.prototype.$other = () => {
...
}
}
}
main.js
1
2
3
4
5
6
import Vue from 'vue';
...
import util from './util.js';
Vue.use(util);
...
사용방법
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<template>
<div>
<input type="text" v-model="text" />
<!-- 템플릿에서 사용예 -->
<span v-if="$empty(text)">있음</span>
<button @click="test()">테스트</button>
</div>
<template>
<sciprt>
export default {
data() {
return {
text: ''
}
},
methods: {
/**
* 스크립트에서 사용예
*/
test() {
if (this.$empty(this.text)) {
alert('없음');
} else {
alert('있음');
}
}
}
}
</script>