Vue.JS且戰且飛(十七)

2017 iT 邦幫忙鐵人賽

DAY 16

Modern Web

Vue.JS且戰且飛系列第 17 篇

2017鐵人賽 vue.js eagle 老鷹且戰且飛

老鷹(eagle)

2016-12-19 22:57:53

1276 瀏覽

分享至

Form Input Select混合技術

jsfiddle

<html>
<head>
    <meta charset="UTF-8">
    <title>Form Input Select混合技術</title>
</head>
<body>
<div id="show">
    <select v-model="name">
        <option v-for="item in items" :value="item">{{ item }}</option>
    </select>

    <div>
        就決定是你了! - {{ name }}
    </div>
</div>
</body>
<script src="vue.js"></script>
<script>
    new Vue({
        el: '#show',
        data: {
            name: '',
            items: ['Eagle', 'SAM', '小雨大', '賽大', '總裁', '海綿寶寶', '蟹老闆', '外獅佬', '聰明佬', '泰大', '熊大', '費公', '...']
        },
        created: function () {

        },
        mounted: function () {

        },
        methods: {}
    })

</script>
</html>