使用vue.js实现hello world

正常不是会显示hello world,第二行才是{{content}}吗?
哪里出问题了?求解

img

img

vue.js文件没有成功引入吧

var app = new Vue 中Vue 的首字母V是大写,你写成了小写v

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <title> 页面名称 </title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="app">{{content}}</div>

<script type="text/javascript">

var app = new Vue({
    el: '#app',
    data: {
        content: 'hello world'
    }
});

</script>

</body>
</html>

img

基于问题,给您点建议

  1. 首先new Vue是对Vue构造函数的实例,Vue字母是大写
  2. 你的data应该是一个函数,不是一个对象,对象会存在重复引用的情况 造成数据混乱 多个组件的时候,
    ps:
    data() {
    return {
    content: 'hello world'
    }
    }

祝好 如有帮助 望点赞 采纳

改为
{{data.content}}