preface

In business components, there may be a lot of the same operations, such as retrieving data, processing data formats, and so on. Repetitive code writing is also annoying for CV experts. Mixins can help reduce the code of individual business components. When I first took over the project, I felt uncomfortable when I saw more than 1000 lines of code in some files. When I carefully looked at the code, there were a lot of repeated operations and even some useless codes. Under Git management, I should ensure that there is no useless code.

use

Take a look at the official documentation for example, and it’s clear that mixins are mods for games.

In the project, we usually need to write the following methods, usually we will find that many vUE files write these methods are the same, so we do not need to write the same code repeatedly by using mixins. At the same time, this is also a kind of separation idea, in the project encountered the same processing logic, More often than not, we choose to encapsulate global handlers.

        methods: {// Get data
            getList(){},// Process data
            handleData(){}},// Call the interface
        created() {
            this.getList()
        },
Copy the code

mixins

Data () {return {list: [] / / list data,}}, the methods: {getList () {}, the handleData () {}}, created () {enclosing getList ()}}Copy the code

reference

import {handleFetch} from '.. /.. /xx'

mixins:[handleFetch]
Copy the code

conclusion

Believe that repeated code and unclear structure is not pleasant, so in the development process to have the idea of pulling away, packaging functions, components to avoid every page repeatedly write the same code, so that the code readability and maintenance are improved, but also reduce the cost of reading other people’s code. This article is just a small Demo of mixins, but it’s a great help in the development process. There may be some part of the description is not clear enough, or there are problems in writing, if the big guy has any suggestions, welcome to leave a message, grateful. This article is part of the “Gold Nuggets For Free!” Event, click to view details of the event