1. Mounted and DeStory life cycle functions do not work properly

Cause: The route uses the tag
, which caches data

The lifecycle scenarios that need to use deStory and beforeDeStory are:

1. Communicate between bus components and other components. 2Copy the code

2. Antd-vue set the column attribute as fixed, which will lead to the unalignment of the dynamic columns when the size of the table is dynamically modified

Cause: The height of the fixed column is higher than that of the ordinary column: The height of the ordinary column is different from that of the fixed column, resulting in an uneven row pair

Solution 1: Remove the column attribute fixed

Solution 2: You can dynamically set the size of the table and refresh the page to achieve the same height

Solution 3: ANTD-Vue is being worked on

3. Antd-vue as the column attribute is set as fixed, the color setting style is invalid when the mouse is set to slide over the background of the table

4.antD-vue

This $refs. ManageForm. ResetFields effect () function is the premise of to form set prop properties, otherwise don’t take effect, can not achieve the effect of the reset

5. ForEach does not support index modification, the underlying control index increment, we can not control, when implementing this function, can use for loop

ForEach is an enhanced version of for, but some features are not supported. For example, it cannot return or break

Typical case

arr.forEach((item, index) => { arr.splice(index, 1); console.log(1); // How many times? 1}); console.log(arr) //? 2Copy the code

When the array arr is only [2], the index is 0, so the deletion is not clean

6. The reduce function can implement the accumulator and calculate the number of occurrences of each letter in a string

Var arr=[1,2,3,40] var total=arr.reduce((item,value)=>{return item+=value},0) console.log(total)Copy the code
Count the number of occurrences of each character in the string var arr=[a, D, S,a, D,f,g,a] var obj=arr.reduce((item,value)=>{item[value]? item[value]++:item[value]=1 return item },{}) consoel.log(obj)Copy the code

7. Why should the state in VUEX be modified through mutation instead of directly

Because state is updated in real time, mutations cannot be operated asynchronously, and it can be operated asynchronously if the state is directly modified. When you operate on state asynchronously, the execution is not complete, and at this time, if the state has been modified in other places, it will cause problems in the program. Therefore, state should operate synchronously, and mutations restrict the asynchronous operation.

8. Cookie does not set expiration time. What is the default expiration time

Close the browser and that’s it

9. Add new functionality to multiple components using mixins, such as clicking on the current row in a table

Example: check multiple data, display the number of data, if the mixin method is not used, it will appear, after the search, the number of data is 0, use this function, you can display the number of searched data

10. The operation column of table that encapsulates ANTD-vue cannot be customized. Dynamic slot name is used

11. Because the integrated components do not meet the requirements of the project, modify the components in node_modules and upload the modified components to Git or SVN for the convenience of other people’s development and later maintenance

The alias of webpack in vue.config.js needs to be modified. Put the file to be modified in the relevant folder under SRC and change the relative path in the file to the absolute path. There is a specific method of use at https://www.cnblogs.com/baixiaoxiao/p/12964170.htmlCopy the code

12. Echars map penetration, click to enter the secondary map: echarts.registerMap() key point is this function method

13. Echars map automatically displays popbox data and highlights, use timer and dispatchAction function, data should be the same as the number of data on the map, otherwise there will be problems

You can refer to https://blog.csdn.net/qq_36947128/article/details/90899564Copy the code

14. The antD-Vue table column drag is not smooth because no specific width is given

Keys only collects its own property name and does not inherit from properties on the stereotype chain.

16. Antd empty input value after placeholder not displayed

this.setState({ opPerson: undefined});
Copy the code

17. When mode=year is set for antD-vue’s date selector, the change event does not take effect, and it is impossible to monitor whether the value changes. You need to manually monitor the change of the value of watch and perform corresponding operations

18. Antd-vue table, only when the table header, even if the width exceeds the set width, there will not be a scroll bar, need to manually change the style

19. Antd-vue cascade selector, return data, need to ensure that the data type in the array is string type

20. Use object.assign () or this.$set() when vue assigns an Object

23. Antd-vue tag, when deleted, there is an animation, so when the tag is displayed, it should be delayed display, otherwise the effect is not good

24. Because the vUE route is lazy to load, there will be multiple JS when packaging, in order to make the first screen load faster, and load the route when it is accessed

Extension: Optimized first screen loading: 1. Lazy route loading 2. Enable Gzip 3

If loading is still too long, add loading 2 to the home page. Home page alone to do server-side rendering

25. When packing vue projects, split them into multiple JS to avoid deploying the entire project each time

Query is not possible, because during packaging, files are re-compressed and encrypted, and during deployment, files are updated according to hash. If the corresponding JS file is not modified, it will not be updated, so the speed will not be very slow

26. The components of routing can be divided into groups, and the chunk can be named by itself. It may be possible to deploy only a single modified file during deployment, but it has not been practiced for the time being

Route lazy load some JS less than 10K, it will not trigger GZIP, so you can multiple files less than 10K, component division by group, because 1+1>2, so it will trigger GZIP, and 10K files, after compression, almost 4K, with no group division is about the same size, so you can improve the speed

Mysql /MariaDB connect to the mysql/MariaDB database to view the data in the corresponding table

29. The column pairs of ANTD-VUE table are not even. It is ok to give the width of each column of the table