uniapp我的页面实例

下面是一个简单的Uniapp页面示例，包括一个模板和一个样式表：

<template>
  <view class="container">
    <text>{{ message }}</text>
    <button @click="changeMessage">Click me!</button>
  </view>
</template>

<style>
  .container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
  }
</style>

<script>
  export default {
    data() {
      return {
        message: 'Hello, Uniapp!'
      }
    },
    methods: {
      changeMessage() {
        this.message = 'You clicked the button!'
      }
    }
  }
</script>

这个页面包含一个视图容器，其中包含一些文本和一个按钮。点击按钮会触发`changeMessage`方法，将文本更改为“你点击了按钮！”。样式表定义了容器的样式，使其在屏幕中央垂直和水平居中。在脚本部分中，我们定义了一个`message`属性，该属性存储文本的当前值，并定义了一个`changeMessage`方法，该方法在按钮点击时更改文本的值。最后，我们将该组件导出为默认模块，以便其他组件可以使用它。