vue中使用select实现多选

<html>
<head>
<script src='js/vue.js'></script>
</head>
<body>
<div id="example">
<select v-model='workplaces' multiple>
<option v-for='city in cities' :value='city.value'>
{{ city.text }}
</option>
</select>
<p>workplace: {{ workplaces.join('|') }}</p>
</div>
</body>

<script type='text/javascript'>
new Vue({
el: '#example',
data: {
cities: [
{text: '西安', value: '西安'}, 
{text: '洛阳', value: '洛阳'}, 
{text: '南京', value: '南京'}, 
{text: '北京', value: '北京'}
],
workplaces: []
}
});
</script>
</html>

猜你喜欢

转载自blog.csdn.net/qq_23143555/article/details/80724964