-2 Hello World 小案例

目录

一、创建案例

二、总结

一、创建案例


<body>
    
    <div id="root">
        <h1>Hello {{name}}h1>
    div>
    <script>
        Vue.config.productionTip = false
 
        // 创建 Vue 实例
        new Vue({
            el: '#root', // 指定服务的容器 
            data: { // data 中用于储存数据
                name: '世界'
            }
        })
    script>
body>

二、总结

1、想让 Vue 工作，必须创建一个 Vue 实例，且传入一个配置对象

2、root 容器中的代码被称为 Vue模板

3、root 容器里的代码符合 html 规范，只是混入了一个 Vue 语法

4、Vue 实例和容器是一一对应的

5、真实开发中只有一个 Vue 实例，并且会配合组件一起使用

6、{{xxx}}中的 xxx 要写 js表达式 ，当 data 中的数据发生改变，则页面中用到该数据的地方都将发生改变

7、注意区分：js表达式 和 js代码

js表达式:一个表达式会生成一个值，可以放在任何一个需要值的地方

例如：a+b,a,

js代码(语句)

例如：if(){},for(){}

相关阅读:
冥想第五百五十九天
信用卡市场发展洞察：浦大喜奔APP探索大零售融合经营体系
ES6 入门教程 21 async 函数 21.3 语法
C#学习记录——基本图形绘制
CompletableFuture异步执行用法详解
ChatGPT角色扮演教程，Prompt词分享
基于uwb和IMU融合的三维空间定位算法matlab仿真
Python图像处理笔记
Vue实现分页功能
无线传感器网络的Z-SEP路由协议及对比（Matlab代码实现）

原文地址：https://blog.csdn.net/sanda_nd/article/details/126732337