1：toRaw方法可以将一个被 reactive 包裹的对象还原为其中的“原始”对象

import { reactive, toRaw } from 'vue'
 
const state = reactive({
  count: 0
})
 
// 获取原始对象
const rawState = toRaw(state)
 
// 验证原始对象与包装后的对象是否相等
console.log(rawState === state) // false
 
// 改变原始对象的值
rawState.count += 1
 
// 验证包装后的对象是否也受到了改变
console.log(state.count) // 1

// 定义请求参数
const params = reactive({
  jobGroup: 11,
  triggerStatus: triggerStatus.value,
  start: start.value,
  length: length.value,
});

const getServerData = () => {
  axios
    .get("/api/xxl-job-admin/jobinfo/pageList", { params: toRaw(params) })
    .then((response) => {
      let data = response.data;
      console.log(data);
      console.log("ddd", params.start);
    });
};

2：markRaw 方法可以将一个对象标记为“非响应式”，从而使其不会被 reactive 包裹，也就不会成为 Vue3 中的响应式对象

import { reactive, markRaw } from 'vue'
 
const state = reactive({
  count: 0,
  obj: {
    name: '张三'
  }
})
 
// 标记 obj 对象为“非响应式”
markRaw(state.obj)
 
// obj 对象不再被 reactive 包裹
console.log(state.hasOwnProperty('__v_raw')) // false
 
// 赋新值时不会触发响应更新
state.obj.name = '李四'
console.log(state.obj.name) // 李四