Vue3 initial experience (basic additions, deletions, checks and changes)

Recently, the company needs to use the vue3 framework for a new project. In fact, I learned it a year ago, but because I am used to vue2, most of the company's projects are also vue2, so vue3 is idle, and I will relearn and use vue3 after a year. Just like a novice, record the problems you encounter~

1. Use

In fact, the <template> part is almost the same as 2, the difference is the js part

First of all, I use Ruoyi's front-end framework, which can be downloaded directly from the official website.

<script setup name="Index"> Added setup to the js part, and use reactive to define objects. When you write reactive, the above will be automatically introduced. toRefs is to convert some of the defined parts. When not converted, use data.from like this After conversion, the defined object can be used directly.

The method is also written normally, but it can be called directly without creating

<script setup name="Index">
import { reactive } from "vue";
const data = reactive({
  form: {},
  queryParams: {
    pageNum: 1,
    pageSize: 10,
  },
  rules: {},
});
const { queryParams, form, rules } = toRefs(data);
const getlist = () => {
 
};
getlist();

</script>