【热门话题】Vue.js：现代前端开发的轻量级框架之旅
<template>
<div id="app">
<h1>欢迎来到{{ title }}</h1>
<p>这是一个使用Vue.js构建的单页应用程序示例。</p>
<button @click="greet">点击我</button>
</div>
</template>
<script>
export default {
name: 'App',
data() {
return {
title: 'Vue.js 之旅'
}
},
methods: {
greet() {
alert('欢迎来到Vue世界！');
}
}
}
</script>
<style>
#app {
text-align: center;
color: #2c3e50;
}
</style>这个简单的Vue.js示例展示了如何创建一个组件，包括模板、脚本和样式。组件包含一个标题、一段文本和一个按钮，点击按钮时会弹出一个警告框。这个过程展示了Vue.js如何连接数据、响应事件以及如何组织代码结构。
评论已关闭