一. <script setup>
1. 引入组件
import Head from "./conponents/head.vue"2. 声明变量
// 引入 ref
import { ref } from 'vue'
const isNeedNav = ref(true)3. 声明方法
const changeLossd = () => {lossdVisible.value = !lossdVisible.value
}4.生命钩子函数
onBeforeMount(() => {})
onMounted(() => {})
onBeforeUpdate(() => {})
onUpdated(() => {})
onBeforeUnmount(() => {})
onUnmounted(() => {})5.父传子参数
父：
<Body :twentyFour="twentyFour"></Body>子：
const porps = defineProps({twentyFour: String,
})JS 中取值：
porps.twentyFourHTML 中取值：
{{ twentyFour }}6.父传子方法
父：
<Body @changeInYear="changeInYear" ></Body>子：
const emit = defineEmits(['changeInYear']); //声明emit
emit('changeInYear')7.watch监听
import { watch } from 'vue'watch(() => chooseNow.value, () => {})8.css深度监听
:deep(.el-table tr) {background: transparent;
}二. export default
1. 引入组件
import switchRoom from './switchRoom.vue'
export default {components: { electricityLoss, switchRoom },
}2. 声明变量
import { ref } from 'vue'
export default {setup(props, contont) {const chooseNow = ref("用电损耗")return {chooseNow,}}
}3. 声明方法
export default {setup(props, contont) {const changeCom = (name) => {chooseNow.value = name}return {changeCom,}}
}4.生命钩子函数
import {
onBeforeMount,
onMounted,
onBeforeUpdate,
onUpdated,
onBeforeUnmount,
onUnmounted,
} from 'vue'
onBeforeMount(() => {})
onMounted(() => {})
onBeforeUpdate(() => {})
onUpdated(() => {})
onBeforeUnmount(() => {})
onUnmounted(() => {})5.父传子参数
父：
<inYearDialog :inYearVisible="inYearVisible" :title='title'></inYearDialog>子：
props: {inYearVisible: Boolean,title: String
},JS 中取值:
setup(props, contont) {onMounted(() => {consoloe.log(props.inYearVisible)})
}HTML 中取值：
{{ inYearVisible }}
转换出来并读取)
 详解)
-C#串口类SerialPort详解)
