The interview summary

I. VUE’s life cycle

1, beforeCreate() has only the events for the instance itself on this lifecycle function, Created () is the first function to manipulate data in data. BeforeMount () already compiles the DOM tree in memory in this lifecycle hook. Mounted () mounted() returns the dom tree in memory to the page. 5, Updated () updated() page and memory have been synchronized with the destruction stage 7, beforeDestroy() Called when an object or component is destroyed, Created () is the first created() operation on data() and other events in data(). Created () is called when the component has been destroyed Mounted () specifies the earliest DOM node to be accessedCopy the code

2. Route interception

It is divided into response interception and request interception

3. How to set the title of the page in Vue

Use doucment.title=' title 'Copy the code

What request interface is used in VUE? How do YOU solve cross-domain problems with Ajax ()

Ajax is the proxy front-end proxy that I configured in the vue scaffolding config in index.js, where there is a proxyTable to configure cross-domain

The first: Jsonp the principle of JSONP is to dynamically create a script tag to request the address of the back-end interface, and then pass a callback parameter. After receiving the callback, the back-end will complete the data processing and return the data in the form of callback function call. The parameters of the callback is the json data the second: is the front-end agents in my config in the vue scaffolding index. The js to configure, including proxyTable to configure the cross-domain third: CORS Cross-region resource sharing (CORS) allows backend engineers to set back-end codes to reach cross-region requests

How to set environment variables in VUE project?

NODE_ENV=== “production” and process.env.node_env === “development” environments are detected to set online and offline environment addresses, so as to realize the switch between online and offline environment addresses

Understand VUex

Answer: vuex is a state management tool, mainly to solve the problem of data sharing in the large and complex project, mainly including the state, the actions, mutations, getters, and modules of five elements, the main process: Components are dispatched to actions, actions are asynchronous operations, and then in actions, commit to mutations, mutations change state through logical operations to synchronize to components. Update its data state, and getters is a component’s calculated property that preprocesses the data it gets from the component. Let’s talk about what auxiliary functions do.

Vii. Component communication VUE

A: There are three types of vUE component communication: parent to child, child to parent, and brother-to-brother communication. Parent child components, introduced by the import, and register, add to pass on child component tag attributes, child components through the props to receive, to receive two forms one is through the array form [‘ to receive property], 2 it is through the object form {} to receive, can be set up to transfer the data type of the object form and the default value, The array simply receives the second: child to parent: mainly throughEmit (‘ custom event to distribute ‘, value to pass),Emit (‘ custom event name ‘, the value to be sent) sends data and receives data in component B via bus.$on (‘ custom event name ‘,function(v) {//v is the value to be received})

Method 2: by vuex concrete implementation: vuex is a state management tool, mainly to solve the problem of data sharing in the large and complex project, mainly including the state, the actions, mutations, getters, and modules of five elements, the main process: The component is dispatched to actions, which is an asynchronous operation, and then in actions, commit to Mutations, which changes state through logical operations, so as to synchronize to the component and update its data state

8 Unidirectional data flow

A: One-way data flow is mainly the transfer of data between VUE components. It is one-way, that is, data is always passed from the parent component to the child component. The child maintains its own data internally, but it has no right to modify the data passed to it by the parent component. This is done for better maintenance between components. In development, there may be multiple child components that depend on the parent’s data. If a child component can modify the parent’s data, a change in a child component will cause changes in all children that depend on the parent’s data, so VUE does not recommend that a child component modify the parent’s data

Nine closure

In layman’s terms, closures are a way to access the scope inside a function from outside it. There are three properties of a function’s internal scope variable that are not normally accessible outside the function: 1. 2. Internal functions can access external functions directly. 3. Variables or parameters will not be collected by the garbage collector. 2. Avoid global pollution 3. Private members in the disadvantages: resident memory, increase the amount of memory how to solve memory leakage? If the value is set to NULL, delete global variables. Application Scenario: The for loop encapsulates components

         function a(){
         var  num=0
        return function b(){
          
                num++
            return num
           
            
        }

    }
    var f=a()

  console.log(f(),f())     Copy the code