SOURCE

console 命令行工具 X clear

                    
>
console
const InputSize = Vue.component('InputSize', {
    data(){
        return{
            inputValue:"123",
            selectItem:"B"
        }
    },
    template: `<div> 
        <input :value="inputValue" @change="inputChange"/>
        <select :value="selectItem" @change="selChange">
            <option value="B">B</option>
            <option value="KB">KB</option>
            <option value="MB">MB</option>
            <option value="GB">GB</option>
            <option value="TB">TB</option>
        </select>
     </div>`,
     methods:{
         inputChange(value){
             this.inputValue = value.target.value
             this.resetData()
         },
         selChange(type){
             console.log(type.target.value)
             this.selectItem = type.target.value
            this.resetData()
         },
         resetData(){
              let num = null
             if(this.selectItem == "B"){
                 num = this.inputValue
             }else if(this.selectItem == "KB"){
                 num = this.inputValue*1024
             }else if(this.selectItem == "MB"){
                 num = this.inputValue*1024*1024
             }else if(this.selectItem == "GB"){
                 num = this.inputValue*1024*1024*1024
             }else if(this.selectItem == "TB"){
                 num = this.inputValue*1024*1024*1024*1024
             }
             if(num<1024){
                 this.inputValue = Number(num).toFixed(2)
                 this.selectItem ="B"
             }else if((num/1024)<1024){
                 this.selectItem ="KB"
                 this.inputValue = (num/1024).toFixed(2)
             }else if((num/1024/1024)<1024){
                 this.selectItem = "MB"
                 this.inputValue = (num/1024/1024).toFixed(2)
             }else if((num/1024/1024/1024)<1024){
                 this.selectItem = "GB"
                 this.inputValue = (num/1024/1024/1024).toFixed(2)
             }else if((num/1024/1024/1024/1024)<1024){
                 this.selectItem = "TB"
                 this.inputValue = (num/1024/1024/1024/1024).toFixed(2)
             }
             this.$emit("change",this.inputValue+this.selectItem)
         }
     }
})

const app = new Vue({
    el: '#app',
    components: { InputSize },
    template: `
        <InputSize @change="change"></InputSize>`,
    methods: {
        change(vavlue) {
            console.log(vavlue)
        }
    }
})
<div id="app"></div>

本项目引用的自定义外部资源