Category：VUE
-
Time：2021-9-17
Vue basic introduction notes 05 V-IF deletes or creates elements every time V-show every display: none or block <!DOCTYPE html> <html lang=”en”> <head> <meta charset=”UTF-8″> <meta name=”viewport” content=”width=device-width, initial-scale=1.0″> <meta http-equiv=”X-UA-Compatible” content=”ie=edge”> <title>Document</title> <script src=”https://cdn.jsdelivr.net/npm/vue”></script> </head> <body> <div id=”app”> < button @ Click = “show =! Show” > button < / button > <!– V-IF […]
-
Time：2021-9-16
Vue basic introduction notes 07 Filters are used for formatting common text in two places interpolation V-bind expression <!DOCTYPE html> <html lang=”en”> <head> <meta charset=”UTF-8″> <meta name=”viewport” content=”width=device-width, initial-scale=1.0″> <meta http-equiv=”X-UA-Compatible” content=”ie=edge”> <title>Document</title> <script src=”https://cdn.jsdelivr.net/npm/vue”></script> <link rel=”stylesheet” href=”https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css” integrity=”sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u” crossorigin=”anonymous”> </head> <body> <div id=”app”> <p>{{msg | msgFormat(‘a’,’b’)}}</p> </div> <script> //Define global filters //Filters can pass […]
-
Time：2021-9-15
Vue learning notes Differences between Vue and MVVM Vue basic code <!DOCTYPE html> <html lang=”en”> <head> <meta charset=”UTF-8″> <meta name=”viewport” content=”width=device-width, initial-scale=1.0″> <meta http-equiv=”X-UA-Compatible” content=”ie=edge”> <title>Document</title> <script src=”https://cdn.jsdelivr.net/npm/vue”></script> </head> <body> <div id=”app”> <p>{{msg}}</p> </div> <script> var vm = new Vue({ el :’#app’, data:{ msg :’hello wold’ } }) </script> </body> </html> Interpolation expression Solving the […]
-
Time：2021-9-14
Vue basic introduction notes 08 Keyboard modifier Keyboard enter Custom instruction Focus case <!DOCTYPE html> <html lang=”en”> <head> <meta charset=”UTF-8″> <meta name=”viewport” content=”width=device-width, initial-scale=1.0″> <meta http-equiv=”X-UA-Compatible” content=”ie=edge”> <title>Document</title> <script src=”https://cdn.jsdelivr.net/npm/vue”></script> <link rel=”stylesheet” href=”https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css” integrity=”sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u” crossorigin=”anonymous”> </head> <body> <div id=”app”> <!– Keyboard modifier — > <input @keyup.f2=’show’ v-model=’name’ type=”text” name=”” id=”input” class=”form-control” value=”” required=”required” pattern=””> <!– […]
-
Time：2021-9-13
Vue basic introduction notes 10 Get to know HTTP requests vue-resource The root domain name Vue. Http. Option. Root = ‘URL’ of the global setting data request interface cannot use an absolute path or /, otherwise the root domain name will not be spliced axios Jsonp principle Due to browser security restrictions, AJAX is not […]
-
Time：2021-9-12
Vue basic introduction notes 11 What is a component In order to split the code volume of Vue examples, we can divide different functional modules with different components. We can call the corresponding components for the functions we need in the future Modularization: it is divided from the perspective of code logic to facilitate layered […]
-
Time：2021-9-11
Vue basic introduction notes 12 Component placeholder: is sets the component to render <!DOCTYPE html> <html lang=”en”> <head> <meta charset=”UTF-8″> <meta name=”viewport” content=”width=device-width, initial-scale=1.0″> <meta http-equiv=”X-UA-Compatible” content=”ie=edge”> <title>Document</title> <script src=”https://cdn.jsdelivr.net/npm/vue”></script> <link rel=”stylesheet” href=”https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css” integrity=”sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u” crossorigin=”anonymous”> </head> <body> <div id=”app”> <div role=”tabpanel”> <!– Nav tabs –> <ul class=”nav nav-tabs” role=”tablist”> <li role=”presentation” class=”active”> //Click different tabs […]
-
Time：2021-9-10
Vue basic introduction notes 13 Pass value from parent component to child component: prop is a user-defined attribute used by parent component to pass data. Subcomponents need to explicitly declare “prop” with the props option: Pass method from parent component to child component:@Method name = parent componentMethod subcomponent passed$this. Emit (‘method name ‘, [transitive parameter]) […]
-
Time：2021-9-9
Vue basic introduction notes 14 <!DOCTYPE html> <html lang=”en”> <head> <meta charset=”UTF-8″> <meta name=”viewport” content=”width=device-width, initial-scale=1.0″> <meta http-equiv=”X-UA-Compatible” content=”ie=edge”> <title>Document</title> <script src=”https://cdn.jsdelivr.net/npm/vue”></script> <link rel=”stylesheet” href=”https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css” integrity=”sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u” crossorigin=”anonymous”> </head> <body> <div id=”app”> <!– The method name passed should not be named after the hump. It’s a pit. I haven’t found the reason for it for a […]
-
Time：2021-9-8
Vue basic introduction notes 15 refUsed to register reference information for elements or subcomponents. The reference information will be registered in the parent component $refs Object. If it is used on an ordinary DOM element, the reference points to the DOM element; If used on a child component, the reference points to the component instance: […]
-
Time：2021-9-7
Vs codenew code snippet routing basic code When learning each knowledge point of Vue, you need to create a new Vue basic code every time, and then use the code fragment of vscode, so you don’t have to copy the code every timeConvenience of fat intestines Open vscode Click menu code = “preferences =” user […]
-
Time：2021-9-6
Two ways of routing parameters query params <!DOCTYPE html> <html lang=”en”> <head> <meta charset=”UTF-8″> <meta name=”viewport” content=”width=device-width, initial-scale=1.0″> <meta http-equiv=”X-UA-Compatible” content=”ie=edge”> <title>Document</title> <script src=”https://cdn.jsdelivr.net/npm/vue”></script> <link rel=”stylesheet” href=”https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css” integrity=”sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u” crossorigin=”anonymous”> <script src=”https://unpkg.com/vue-router/dist/vue-router.js”></script> </head> <body> <div id=”app”> <!– 1. Use query to pass parameters — > < router link to = “/ login? Id = 10 & […]
