下载地址：cdn.bootcdn.net/ajax/libs/v…
看到很多小伙伴想学习Vue 3.0，但是网上的教程都是克隆整个项目然后自己打包，很麻烦，所以找到了这个cdn链接分享给大家
示例（复制代码可以直接使用）
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div id="app">
<button @click="increment">点击按钮</button>
<div>{{state.message}}, double is: {{state.double}}</div>
</div>
<script src="https://cdn.bootcdn.net/ajax/libs/vue/3.0.0-beta.14/vue.global.js"></script>
<script>
var App = {
setup() {
var state = Vue.reactive({
message: 10,
double: Vue.computed(() => state.message * 2)
})
function increment() {
state.message++
}
Vue.onMounted(() => {
console.log('Mounted')
})
return {
state,
increment
}
}
}
var vm = Vue.createApp(App).mount("#app");
</script>
</body>
</html>
数据响应写法的变化
我们知道之前的数据写在Vue的data选项中，Vue会自动将data中的数据转化为响应式数据，Vue 3的写法有所不同，如果是单个数据需要使用Vue.ref方法转化为响应式数据，如果是一个对象，需要使用Vue.reactive转化为响应式数据。
生命周期函数的变化
Vue 3删除了create阶段的2个生命周期函数，现在可以把create时执行的代码写在setup函数中。其余的生命周期函数没太大变化，只是名子上有所不同，比如mounted函数现在改为onMounted。
