我是VueJS的完全初学者，这是我的第一个应用程序。这是一个Hello world应用程序，但代码不起作用；(HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Learning VueJS</title>
</head>
<body>
<div id="app">
<p>{{ title }}</p>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/3.0.0/vue.cjs.js"></script>
<script src="script.js"></script>
</body>
script.js
new Vue({
el: '#app',
data: {
title: 'Hello world!'.
}
});
您的data必须是一个函数。
new Vue({
el: '#app',
data()
return {
title: 'Hello world!',
};
}
});
请参阅文档：https://v2.vuejs.org/v2/guide/components.html#data-Must-Be-a-Function
您使用的CDN链接使用Vue 3版本，代码语法在Vue 2中运行，因为您是初学者，所以应该将CDN链接更改为Vue 2:
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.11"></script>
let app = new Vue({
el: '#app',
data: {
title: 'Hello world!'
}
});<script src="https://cdn.jsdelivr.net/npm/vue@2.6.12"></script>
<div id="app">
<p>{{ title }}</p>
</div>