廖井涛
6 小时以前 f7a2fcdda7f1120498c5c5f75c5a99955fc54b43
north-glass-erp/northglass-erp/src/components/ComputedTest.vue
New file
@@ -0,0 +1,47 @@
<template>
  <div>
    {{ a }}
    <br><br>
    {{ result }}
    <br><br>
    {{ b }}
    <br><br>
    <el-button @click="b++">123123</el-button>
    <br><br>
    {{ '父组件传值给子组件:'+car }}
  <br><br>
  <el-button @click="gaveParent">子组件传递数据给父组件</el-button>
  </div>
</template>
<script setup>
  import {ref,computed,watch,defineProps,defineEmits} from 'vue'
  let a = $ref([1,2,3,4,5,6])
  let b =ref(0)
  let props = defineProps({
    car:{
      String,
      default:0
    }
  })
  const emit = defineEmits(['changeNum'])
  const gaveParent = () => {
    emit('changeNum','子组件给父组件传值了')
  }
  //使用计算属性过滤出数组中小于2的
  const result=computed( () => {
    return a.filter(item => item>2)
  })
  watch(b,(newValue,oldValue) => {
    console.log("改变了当前值:"+newValue+" "+oldValue)
  })
</script>
<style scoped>
</style>