vue3

1. defineComponent

vue3中，新增了 defineComponent ，就是把接收的 Object 直接返回。但是，就类型而言，返回的值有一个合成类型的构造函数，用于手动渲染函数、TSX 和 IDE 工具支持。

import { defineComponent,ref } from 'vue';

export default defineComponent({
  setup() {
    const num = ref(1)
    return { num }
    }
});

2. ref reactive

ref创建基本数据类型的数据，reactive创建引用数据类型的数据
注意点： template中使用ref值不用value获取,js中使用ref值必须通过value获取。

3. vue3中使用vuex 必要吗？

使用Vue3的 provide与 inject 可替代vuex

4. 依赖注入 blog.csdn.net/qq_42365082…

使用场景：父组件数据共享给子、孙组件。
#数据修改原则： 数据谁定义，谁修改

5. vue3 + ts路由配置

// 1. 引用创建路由需要的组件
import { createRouter, createWebHashHistory, RouteRecordRow } from 'vue-router'  
// 2. 配置系统所有路由页面
const routes: Array<RouteRecordRaw> = [
  {
    path: '/',
    name: 'Home',
    component: () => import('../vieww/Home.vue')
  },
  {
    path: '/about',
    name: 'About',
    componet: () => impport(/* webpackChunkName: "about"*/ '../views/About.vue')
  }
]
3. 创建路由实例
const router = createRouter({
  history: createWebHashHistory(), // 使用hash模式
  routes
})

const queryForm = reactive({

                dimension: 'partition' as 'partition'|'device'|'anchorType'|'fansLevel',

                daterange: [moment().subtract(11, 'days').format('YYYY-MM-DD'), moment().subtract(1, 'days').format('YYYY-MM-DD')] as [string, string],

            })
            const data_userNumber = ref<any>([])
            const loading = ref(false)

const data_userNumber = ref<any>([])
data_userNumber.value = data.user
getBusinessList(this.params).then(( { data } ) **=>** {

        this.businessData.total = data.totalSize

        this.businessData.data = this.businessData.data.concat(data.businessVoList)

        this.loading = false

        this.params.page++

      })

vue子组件和父组件的执行顺序 常见冒泡排序算法 -冒泡排序 -选择排序 选择排序是冒泡排序的改进 vxe-table 强大的基于vue的表格插件
@scroll  底部触发调用接口

listenScroll(e) {

      let ele = e.srcElement ? e.srcElement : e.target

      *//* 监听滚动到底部

      if (ele.scrollTop + ele.offsetHeight >= ele.scrollHeight) {

        this.getScene()

      }

    }