如果你要做的不是数据的绑定，而是属性的绑定，那么就需要v-bind
    这是一个超链接

    1. <!DOCTYPE html>
    2. <html>
    3.     <head>
    4.         <meta charset="utf-8">
    5.         <title></title>
    6.     </head>
    8.     <body>
    9.         <script type="text/javascript" src="https://unpkg.com/vue/dist/vue.js"></script>
    11.         <div id="app">
    12.             <a href= {{ url }} > 草榴社区</a>
    13.         </div>
    15.         <script >
    16.             var vm = new Vue ({
    17.                 el: "#app",
    18.                 data :{
    19.                     url: "www.baidu.com",
    20.                 },
    21.             })
    22.         </script>
    24.     </body>
    25. </html>

    这样不行的是无法识别的
    应该使用v-bind

    <!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>

    <body>
        <script type="text/javascript" src="https://unpkg.com/vue/dist/vue.js"></script>

        <div id="app">
            <a v-bind:href="url">草榴社区</a>
        </div>

        <script>
            var vm = new Vue ({
                el: "#app",
                data: {
                    url: "https://www.baidu.com",
                },
            })
        </script>

    </body>
</html>

    V-bind 实际上可以使用更简单的方式
    v-bind: 可以简写为: