change 是Element Select选择器提供的一个方法回调 一般使用在选择器和输入框之间
场景是选择器选择不同的值时输入框的值是根据选择器的值来变化
<template>
<div>
<el-card>
<el-select v-model="value" placeholder="请选择" @change="Variety">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<el-input v-model="input" disabled style="width: 150px;" placeholder="请输入内容" />
</el-card>
</div>
</template>
<script>
export default {
data() {
return {
input: '',
value: '',
options: [
{
value: '1',
label: '黄金糕'
}, {
value: '2',
label: '双皮奶'
}
]
}
},
computed: {},
created() {},
mounted() {},
methods: {
Variety(e) {
// 这个e是change方法自己返回给我们的,它里面是你选择器选择的值,这里的值是value
// 所以Variety这个方法点击或者选择时什么都用传,直接接收一下就行了
console.log(e)
if (e === '1') {
this.input = '黄金糕'
} else {
this.input = '双皮奶'
}
}
}
}
</script>
<style scoped lang="scss">
</style>