Skip to content

Instantly share code, notes, and snippets.

@RexSkz

RexSkz/el-option-test.html

Last active August 16, 2017 07:12
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save RexSkz/1220589c5425cb16306050b812511d0a to your computer and use it in GitHub Desktop.
Save RexSkz/1220589c5425cb16306050b812511d0a to your computer and use it in GitHub Desktop.
Download ZIP
Too many events are emited when `el-select`'s option changed
Raw
el-option-test.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="robots" content="noindex, nofollow">
<meta name="googlebot" content="noindex, nofollow">
<script type="text/javascript" src="https://fiddle.jshell.net/js/babel/babel.js"></script>
<script type="text/javascript" src="https://fiddle.jshell.net/js/lib/dummy.js"></script>
<link rel="stylesheet" type="text/css" href="https://fiddle.jshell.net/css/result-light.css">
<style type="text/css">
/* css start */
@import url("http://unpkg.com/element-ui@1.4.2/lib/theme-default/index.css");
/* css end */
</style>
<title></title>
<script type="text/babel" data-presets="es2017,react,stage-0" data-plugins="transform-decorators-legacy">
// script start
var Main = {
data() {
return {
options: [],
value: ''
}
},
methods: {
clearAll() {
this.options = []
}
},
mounted() {
var options = []
for (var i = 0; i < 30; i++) {
options.push({
value: i,
label: 'Option ' + i
})
}
this.options = options
}
}
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')
// script end
</script>
</head>
<body>
<script src="http://unpkg.com/vue/dist/vue.js"></script>
<script src="http://unpkg.com/element-ui@1.4.2/lib/index.js"></script>
<!-- template start -->
<div id="app">
<template>
<el-select v-model="value" placeholder="Select">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
<el-button @click="clearAll">Clear all select options</el-button>
<div>You selected "{{value}}".</div>
</template>
</div>
<!-- template end -->
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment