Vue encapsulates a search component, there is a problem

clipboard.png

component code:

<template>
    <el-input 
        v-model="val"
        :placeholder="tip" 
        size="small" 
        clearable 
        @keyup.enter.native="echo()">
    </el-input>
</template>

<script>
export default {
    props:["tip"],
    data () {
        return {
            val:""
        }
    },
    methods:{
        echo:function(){
            alert(val)
        }
    }
}
</script>

Why do you always prompt: val is not defined? every time you press enter? Haven"t I already defined val

The

alert (this.val)


function has an independent scope. When you pop up val , you will only look in the function scope to see if this variable is defined.


Pop up defective: alert (this.val) or @ keyup.enter.native= "echo (val)" to pass parameters

MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1b37715-2c07b.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1b37715-2c07b.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?