笔记：代码与笔记上传

3.3/Vue3Proj/vue-project/src/Vue2_4.vue

@@ -0,0 +1,38 @@
+<template>
+  <h3>计算属性的应用</h3>
+  <div>
+    <p>数组元素为：{{ arrayNumber }}</p>
+    <p>数组中最大数为：{{ maxNumber }}</p>
+    <!-- <p>数组中最大数为：{{maxNumber}}</p> -->
+    <p>
+      <span>方法：数组中最小数为：{{ min }}</span
+      ><button v-on:click="findMinNumber()">求最小值</button>
+    </p>
+    <p>函数：数组中最小数为：{{ minNumber() }}</p>
+    <!-- <p>函数：数组中最小数为：{{minNumber()}}</p> -->
+    <p>原来message:{{ message }}</p>
+    <p>函数处理后：{{ message.split(" ").reverse() }}</p>
+  </div>
+</template>
+<script setup lang='ts'>
+import { log } from "console";
+import { computed, ref } from "vue";
+const arrayNumber = ref([3000, -2000, 1308, 278, 225, 556, 1110]);
+const min = ref(0);
+const message = ref("The Progressive JavaScript Framework");
+const maxNumber = computed(() => {
+  console.log("maxNumber");
+  console.log(arrayNumber);
+  return Math.max(...arrayNumber.value);
+});
+const minNumber = () => {
+  console.log("minNumber");
+  return Math.min(...arrayNumber.value);
+};
+const findMinNumber = () => {
+  console.log("findMinNumber");
+  min.value = Math.min(...arrayNumber.value);
+};
+</script>
+<style scoped>
+</style>

3.3/Vue3Proj/vue-project/src/main.ts

@@ -1,9 +1,9 @@
 import './assets/main.css'
 
 import { createApp } from 'vue'
-import Vue2_1 from './Vue2_1.vue'
+import Vue2_4 from './Vue2_4.vue'
 
-const app = createApp(Vue2_1)
+const app = createApp(Vue2_4)
 
 app.use(app);