vue初识 --- 页面初始化

    <div id="app">
        <input type="" class="app"  v-model="txt_name" />
        <div  @click="clk" class="btn">点我</div>
        <div class="text">{{ txt_name }}</div>
    </div>

<script>
    (function(){
        //text一般为从后台获取的数据，需要在页面初始化的时候直接将text渲染到input中，给用户展示。
        let text = "初始化赋值123"
        //实例化vue
        new Vue({
            el:"#app",
            //data用于存放数据或者变量
            data:{
                txt_name:""
            },
            //用于数据初始化
            created:function(){
                this.txt_name = text;
            },
            //用于存放所有的事件方法集合
            methods: {
                clk(){
                    txt_name = this.txt_name;
                    alert(txt_name);
                }
            }
        })  
    })()
</script>