标签：else let 绑定 sele option 显示 说明 element 功能
功能需求：
在下拉框中选择你所需要缩放的比例，
选择好了之后，图片会按照你选择的比例进行缩放
1==》如何获取select中option选中的值
在select添加事件change 和双向绑定v-model
<select @change="changeValue" v-model="myVal">
<option value="1">1:1</option>
<option value="1.5">1:1.5</option>
</select>
data中 myVal:"1"
ps==>当myVal为1时，option显示1:1，当myVal为1。5时，option显示1:5，
所以说明了 select中的v-model(value)值是1时，就会自动显示option中对应的值。
console.log(this.myVal)
2==》找到控制图片的节点，使用scale进行动态绑定
let ele=document.getElementById("img")
ele.style.transform="scale(1)";
<div id="app">
<select @change="changeValue" v-model="myVal">
<option value="1">1:1</option>
<option value="1.5">1:1.5</option>
</select>
<br/>
<br/>
<img src="./01.jpg" id="img">
</div>
<script>
new Vue({
el: ‘#app‘,
data() {
return {
myVal:"1",
scaleSize:"",
};
},
methods: {
changeValue(){
let ele=document.getElementById("img");//获取节点
console.log(this.myVal)
if(this.myVal=="1"){
this.scaleSize=1;
ele.style.transform="scale(1)";
}else if(this.myVal=="1.5"){
this.scaleSize=1.5;
ele.style.transform="scale(1.5)";
}
}
},
})
</script>
标签：else let 绑定 sele option 显示 说明 element 功能
原文地址：https://www.cnblogs.com/IwishIcould/p/11960604.html
