[Vue.js] v-model.number轉型失敗時

by ShadowKao

HTML

<!doctype html>
<html  >
<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">

    <title>Hello, Vue.js!</title>
    <style type="text/css">
        body {
            padding-top: 30px;
        }  
    </style>
</head>
<body> 
    <div class="container" id="myApp">
        <div class="row">
            <div class="form-group col-12">
                <label>不加修飾符.number，試試輸入1234，會被當做字串</label>
                <input type="text" v-model="age" name="age" placeholder="請輸入數字或字串" class="form-control" /> <br />
                <label>
                    試試輸入一般字串，修飾符v-modal.number轉型失敗時，會當做字串型別
                </label>
                    <input type="text" v-model.number="age" name="age" placeholder="請輸入數字或字串" class="form-control" />
            </div>
            <div class="form-group col-12" v-text="`型別:${typeof(age)}:內容:${age}`">
            </div>
            </div>
        </div>


    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://code.jquery.com/jquery-3.3.1.min.js" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>
    <!-- 引用Vue.js -->
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script>
    <script type="text/javascript">
 
        let app = new Vue({
           ...