Common instructions for Vue

The scenery of life 2020-11-29 18:49:27
common instructions vue


One .Vue Introduce

​ Vue ( pronunciation /vjuː/, Be similar to view) Is a set for building user interfaces Progressive framework . Unlike other large frameworks ,Vue Designed to be applied layer by layer from the bottom up .Vue The core library focuses only on the view layer , Not only easy to get started , It is also easy to integrate with third-party libraries or existing projects . On the other hand , When and Modern tool chain As well as a variety of Support library When used in combination ,Vue It is also fully capable of providing drivers for complex single-page applications .

Two . Usage method

Download to local reference :

​ Development Edition : https://cn.vuejs.org/js/vue.js

​ Production version :https://cn.vuejs.org/js/vue.min.js

Quote online :

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

npm install :

// Latest stable version
npm install vue
// install vue-cli Scaffolding construction tool
npm install --global vue-cli

Official website :https://cn.vuejs.org/

3、 ... and .vue Introduction instructions

vue Instance creation

<body>
<!-- Definition id by app As Anchor point -->
<p id="app">
<!-- vue expression {{}} Two curly brackets , It's a data name -->
{{msg}}
</p>
<!-- introduce vue.js -->
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
// establish vue example
new Vue({
// el It stands for On the page id value
el: '#app',
// data Is the data , And json data
data: {
msg: "hello vue",
}
})
// The page will show hello vue
</script>
</body>

Be careful :vue Expression syntax is two curly brackets {{msg}} Write the corresponding data name in the instance , The data name must be in the corresponding vue Under the example .

Writing examples vue when it is to be noted that Properties and Space between attribute names

  • Instructions
    1. The essence is a custom attribute
    2. Vue The instructions in Chinese are all in the form of v- start

v-text Instructions

 <body>
<div id="app">
<!-- In the use of v-text You don't need to label {{}} The effect is equivalent to {{msg}} -->
<p v-text="msg"></p>
<p>{{msg}}</p>
</div>
<!-- Import vue.js -->
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
// Writing examples vue when it is to be noted that Properties and Space between attribute names
new Vue({
el: '#app',
data: {
msg: "v-text test "
}
})
</script>
<!-- Page effects Printed two v-text test -->
</body>

v-html Instructions

  • Usage and v-text be similar But he can put HTML The fragment is filled into the tag

  • There may be security issues , Generally only use on trusted content v-html, never For user submissions

  • It is associated with v-text The difference lies in v-text The output is plain text , The browser doesn't do it again html analysis , but v-html It will be regarded as html After the label is parsed, the output is .

<body>
<div id="app">
<!-- v-html The command will render and parse the tag -->
<p v-html="html"></p>
<!-- Output :<span>html Tags are output by source code when rendering </span> -->
<p v-text="text"></p>
<!-- msg Common grammar -->
<p>{{msg}}</p>
</div>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
let app = new Vue({
el: "#app",
data: {
msg: "<span > Ordinary double tags don't parse span label </span>",
html: "<span>v-html Instruction can render and parse tags </span>",
text: "<span>v-text No resolution label Like double curly braces </span>"
}
})
</script>
</body>

v-text and v-html Equivalent to native js Medium .text and .html identical It's the same nature

v-pre Instructions

  • Show raw information skip compilation
  • Skip the compilation of this element and its children .
  • Some static content does not need to compile and add this instruction to speed up rendering
<body>
<div id="app">
<!--
Use v-pre Instructions Will skip vue Compilation process
therefore p In the tag {{msg}} It won't be vue Identify compilers
Then the page will directly show {{msg}}
-->
<p v-pre>{{msg}}</p>
</div>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
new Vue({
el: "#app",
data: {
msg: "v-pre Instruction will prevent the syntax expression from being recognized "
}
})
</script>
</body>

v-model Instructions

  • v-model It's an instruction , Restriction on <input>、<select>、<textarea>、components Use in

  • v-model Is a bidirectional data binding instruction

Two way data binding
  • When the data changes , The view changes
  • When the view changes , The data will also change synchronously
<body>
<div id="app">
<span>{{msg}}</span>
<br>
<!--
During page testing When modifying input Content ,vue In the instance msg The value changes with it
above span Values in labels Will follow vue Data changes in instances ,v-model two-way
The benefits of binding are already obvious
-->
<input type="text" name="" id="" v-model="msg" />
</div>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
let app = new Vue({
el: "#app",
data: {
msg: "v-model Instruction test "
}
})
</script>
</body>

v-once Instructions

<body>
<div id="app">
<!--
Use v-pre Instructions Will skip vue Compilation process
therefore p In the tag {{msg}} It won't be vue Identify compilers
Then the page will directly show {{msg}}
-->
<p v-pre>{{msg}}</p>
</div>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
new Vue({
el: "#app",
data: {
msg: "v-pre Instruction will prevent the syntax expression from being recognized "
}
})
</script>
</body>

mvvm Concept

  • MVC It's the back-end layered development concept ; MVVM It's the concept of the front view layer , Focus on View layer separation , in other words :MVVM Put the front view layer , Divided into In the third part of Model, View , VM ViewModel
  • m model
    • The data layer Vue in The data layer All put in data Inside
  • v view View
    • Vue in view namely our HTML page
  • vm (view-model) controller Connect the data to the view layer
    • vm namely Vue Example Namely vm

v-on Instructions

<body>
<div id="app">
<p>{{num}}</p>
<!-- Bind click event Every click ,num value ++ once This operation is generally not recommended -->
<button type="button" v-on:click="num++"> Normal Click </button>
<button type="button" v-on:click="handlel($event)" name="event test "> Click on </button>
<button type="button" v-on:click="handlel2(123,222,$event)"> Click with reference </button>
</div>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
new Vue({
el: "#app",
data: {
num: 0
},
methods: { // methods The method to store the call
handlel: function(event) {
console.log(event.target.innerHTML)
console.log(event.target.name)
},
handlel2: function(p, p1, event) {
console.log(p, p1)
console.log(event.target.innerHTML)
// this Point to the current vue example this.num++ Will be num Value ++
this.num++;
}
}
})
</script>
</body>

expand :$event After comparing the parameters , Find out The event What is passed in is the object of the current tag , We can use this object to get parameter classes such as text content event.target.innerHTML perhaps event.target.name

Key modifier

​ Keyboard events are sometimes used in projects , When listening for keyboard events , We often need to check the detailed buttons .Vue Allow for v-on Add key modifiers when listening for keyboard events

 <body>
<div id="app">
<!-- Trigger the event call when the keyboard clicks once submit Method -->
<input v-on:keyup="submit($event)" value=" Keyboard click " />
<!-- Specify a specific keyboard key value To call Only when you click lowercase a Will trigger when -->
<input v-on:keyup.65="submit($event)" type="button" value="65" />
<!-- When the mouse button is raised, the event is triggered call mouseup Method -->
<input v-on:mouseup="mouseup($event)" type="button" value=" Mouse click " />
<!--
above It's a demonstration of keyboard and mouse events , You can also expand other similar operations 、
Common key modifiers
.enter => enter key
.tab => tab key
.delete ( Capture “ Delete ” and “ Backspace ” Key ) => Delete key
.esc => Cancel key
.space => Space bar
.up => On
.down => Next
.left => Left
.right => Right
-->
</div>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
new Vue({
el: "#app",
data: {
},
methods: {
submit: function(event) {
console.log(event.target.value);
},
mouseup: function(event) {
console.log(event.target.value);
}
}
})
</script>
</body>

Custom key alias

  • stay Vue Through config.keyCodes Custom key modifier alias
<body>
<div id="app">
<button type="button" v-on:keydown.fn="prompt($event)" value=" I'm a custom button "> I'm a custom button </button>
</div>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
// take a Of The key value is defined as fn , And then use it directly in the control fn You don't usually use it like this
Vue.config.keyCodes.fn = 65;
new Vue({
el: "#app",
methods: {
prompt: function(event) {
alert(event.target.value);
}
}
})
</script>
</body>

keyCode List of values

Virtual key Hexadecimal value Decimal value Corresponding keyboard or mouse button
VK_LBUTTON 01 1 Left mouse button
VK_RBUTTON 02 2 Right mouse button
VK_CANCEL 03 3 Ctrl-Break key
VK_MBUTTON 04 4 Middle mouse button
VK_BACK 08 8 Backspace key
VK_TAB 09 9 Tab key
VK_CLEAR 0C 12 Clear key
VK_RETURN 0D 13 Enter key
VK_SHIFT 10 16 Shift key
VK_CONTROL 11 17 Ctrl key
VK_MENU 12 18 Alt key
VK_PAUSE 13 19 Pause key
VK_CAPITAL 14 20 Caps Lock key
VK_ESCAPE 1B 27 Esc key
VK_SPACE 20 32 Space key
VK_PRIOR 21 33 Page Up key
VK_NEXT 22 34 Page Down key
VK_END 23 35 End key
VK_HOME 24 36 Home key
VK_LEFT 25 37 ← key
VK_UP 26 38 ↑ key
VK_RIGHT 27 39 → key
VK_DOWN 28 40 ↓ key
VK_SELECT 29 41 Select key
VK_PRINT 2A 42 Print key
VK_EXECUTE 2B 43 Execute key
VK_SNAPSHOT 2C 44 Print Screen key
VK_INSERT 2D 45 Ins key
VK_DELETE 2E 46 Del key
VK_HELP 2F 47 Help key
VK_0 0x30 48 0 key
VK_1 0x 31 49 1 key
VK_2 0x 32 50 2 key
VK_3 0x 33 51 3 key
VK_4 0x 34 52 4 key
VK_5 0x 35 53 5 key
VK_6 0x 36 54 6 key
VK_7 0x 37 55 7 key
VK_8 0x 38 56 8 key
VK_9 0x 39 57 9 key
VK_A 41 65 A key
VK_B 42 66 B key
VK_C 43 67 C key
VK_D 44 68 D key
VK_E 45 69 E key
VK_F 46 70 F key
VK_G 47 71 G key
VK_H 48 72 H key
VK_I 49 73 I key
VK_J 4A 74 J key
VK_K 4B 75 K key
VK_L 4C 76 L key
VK_M 4D 77 M key
VK_N 4E 78 N key
VK_O 4F 79 O key
VK_P 50 80 P key
VK_Q 51 81 Q key
VK_R 52 82 R key
VK_S 53 83 S key
VK_T 54 84 T key
VK_U 55 85 U key
VK_V 56 86 V key
VK_W 57 87 W key
VK_X 58 88 X key
VK_Y 59 89 Y key
VK_Z 5A 90 Z key
VK_LWIN 5B 91 Left Windows key
VK_RWIN 5C 92 Right Windows key
VK_APPS 5D 93 Application key
VK_SLEEP 5F 95 Sleep key
VK_NUMPAD0 60 96 Small number keyboard 0 key
VK_NUMPAD1 61 97 Small number keyboard 1 key
VK_NUMPAD2 62 98 Small number keyboard 2 key
VK_NUMPAD3 63 99 Small number keyboard 3 key
VK_NUMPAD4 64 100 Small number keyboard 4 key
VK_NUMPAD5 65 101 Small number keyboard 5 key
VK_NUMPAD6 66 102 Small number keyboard 6 key
VK_NUMPAD7 67 103 Small number keyboard 7 key
VK_NUMPAD8 68 104 Small number keyboard 8 key
VK_NUMPAD9 69 105 Small number keyboard 9 key
VK_MULTIPLY 6A 106 Multiplier key
VK_ADD 6B 107 Plus key
VK_SEPARATOR 6C 108 Split key
VK_SUBSTRACT 6D 109 Minus key
VK_DECIMAL 6E 110 Decimal key
VK_DIVIDE 6F 111 Division key
VK_F1 70 112 F1 key
VK_F2 71 113 F2 key
VK_F3 72 114 F3 key
VK_F4 73 115 F4 key
VK_F5 74 116 F5 key
VK_F6 75 117 F6 key
VK_F7 76 118 F7 key
VK_F8 77 119 F8 key
VK_F9 78 120 F9 key
VK_F10 79 121 F10 key
VK_F11 7A 122 F11 key
VK_F12 7B 123 F12 key
VK_F13 7C 124 F13 key
VK_F14 7D 125 F14 key
VK_F15 7E 126 F15 key
VK_F16 7F 127 F16 key
VK_F17 80 128 F17 key
VK_F18 81 129 F18 key
VK_F19 82 130 F19 key
VK_F20 83 131 F20 key
VK_F21 84 132 F21 key
VK_F22 85 133 F22 key
VK_F23 86 134 F23 key
VK_F24 87 135 F24 key
VK_NUMLOCK 90 144 Num Lock key
VK_SCROLL 91 45 Scroll Lock key
VK_LSHIFT A0 160 Left Shift key
VK_RSHIFT A1 161 Right Shift key
VK_LCONTROL A2 162 Left Ctrl key
VK_RCONTROL A3 163 Right Ctrl key
VK_LMENU A4 164 Left Alt key
VK_RMENU A5 165 Right Alt key

v-bind Instructions

  • v-bind Instructions are used to update HTML attribute
 <style type="text/css">
/* Define groups of styles */
.p1Color {
color: blue;
}
.p2Color {
color: darkred;
}
.p1Text {
font-size: 18px;
}
.p1Text {
font-size: 10px;
}
</style>
</head>
<body>
<div id="app">
<!-- binding p1Color And select isColor isColor Defined as true You can also write directly true-->
<p v-bind:class="{p1Color:isColor}">
Study v-bind Instructions
</p>
<button v-on:mouseup="changeColor">{{chgColor}}</button>
<p></p>
<p></p>
</div>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
new Vue({
el: "#app",
data: {
isColor: true,
isText: true,
color: "yellow",
size: "14px",
chgColor: " Turn off styles "
},
methods: {
changeColor: function() {
// Click event Turn off and on p Style of label
if (this.isColor === true) {
this.isColor = false;
this.chgColor = " Open style "
} else {
this.isColor = true;
this.chgColor = " Turn off styles "
}
}
}
})
</script>
</body>
v-bind binding class
 <style type="text/css">
/* Define groups of styles */
.p1Color {
color: blue;
}
.p2Color {
color: darkred;
}
.p1Text {
font-size: 18px;
}
.p1Text {
font-size: 10px;
}
</style>
</head>
<body>
<div id="app">
<!-- take style It's defined in vue In the example , then Bound to the DOM On -->
<!-- :class Equate to v-on:calss -->
<p :class="[colorA,textA]">
Study v-bind Instructions
</p>
<button v-on:mouseup="changeAColor">{{chgColor}}</button>
<p v-bind:class="[colorB,textB]">
Study v-bind Instruction binding class
</p>
<button v-on:mouseup="changeBColor">{{chgColor}}</button>
<p></p>
</div>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
new Vue({
el: "#app",
data: {
colorA: "p1Color",
colorB: 'p2Color',
textA: 'p1Text',
textB: 'p2Text',
chgColor: " Switching styles "
},
/* Definition Two Method to switch styles */
methods: {
changeAColor: function() {
if ("p1Color" === this.colorA) {
this.colorA = 'p2Color';
} else {
this.colorA = 'p1Color';
}
},
changeBColor: function() {
if ("p2Color" === this.colorB) {
this.colorB = 'p1Color';
} else {
this.colorB = 'p2Color';
}
}
}
})
</script>
</body>
Bind objects and bind arrays The difference between
  • When binding objects Object properties The name of the class to render The attribute value of an object corresponds to data Data in
  • When binding an array, the array contains data Data in
binding style v-bind:style
<body>
<div id="app">
<!-- :style Equate to v-bind:style -->
<p :style="{ color:colorB, fontSize:fontSize}">
v-bind:style Style binding inline style
</p>
<p v-bind:style="[styleB, styleA]">
v-bind:style Style binding Array binding
</p>
</div>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
new Vue({
el: "#app",
data: {
/* stay data It defines groups of Style data */
styleObject: {
color: "green",
fontSize: "18px"
},
colorB:"green",
fontSize:"18px",
styleA: {
color: "red"
},
styleB: {
fontSize: "28px"
}
}
})
</script>
</body>

Branch loop

v-if Instructions

<body>
<div id="app">
<!-- Use v-if Command to judge flag -->
<p v-if="flag === true">
{{msg}}
</p>
<p v-if="flag === false">
{{msg2}}
</p>
<button type="button" @click="changeClick"> Am I </button>
</div>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
new Vue({
el: "#app",
data: {
flag: true, // Set logo by true For page judgment
msg: " I came out ",
msg2: " I disappeared "
},
methods: {
changeClick: function() {
if (this.flag === true) {
this.flag = false;
} else {
this.flag = true;
}
}
}
})
</script>
</body>

v-show Instructions

<body>
<div id="app">
<p v-show="1===1">v-show Judgment for true I showed </p>
<p v-show="1===2">v-show by flase When I hide </p>
<!-- Use v-show Command to judge flag -->
<p v-show="flag === true">
{{msg}}
</p>
<p v-show="flag === false">
{{msg2}}
</p>
<button type="button" @click="changeClick"> Am I </button>
</div>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
new Vue({
el: "#app",
data: {
flag: true, // Set logo by true For page judgment
msg: " I came out ",
msg2: " I disappeared "
},
methods: {
changeClick: function() {
if (this.flag === true) {
this.flag = false;
} else {
this.flag = true;
}
}
}
})
</script>
</body>

v-show and v-if The difference between

  • v-show The essence is the label display Set to none, Control hide
    • v-show Compile only once , The back is control css, and v-if Constantly destroy and create , so v-show Better performance .
  • v-if It's dynamic DOM Add or remove... From the tree DOM Elements
    • v-if The switch has a partial compilation / Uninstallation process , Properly destroy and rebuild the internal event monitor and sub components during the handover process

v-for Cyclic instruction

<body>
<div id="app">
<!-- Loop traversal data in items data -->
<p v-for="item in items">
<span>id: {{item.id}} </span>
<span>name: {{item.name}} </span>
<span>age: {{item.age}} </span>
<br>
</p>
<!-- The page will loop through
id: 1 name: Li Si age: 20
id: 2 name: Wang Wu age: 19
id: 3 name: Zhang Fei age: 33
-->
</div>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
new Vue({
el: "#app",
// Get ready Loop simulation data
data: {
items: [{
id: 1,
name: " Li Si ",
age: 20
},
{
id: 2,
name: " Wang Wu ",
age: 19
},
{
id: 3,
name: " Zhang Fei ",
age: 33
},
]
}
})
</script>
</body>

Be careful :

  • Not recommended Use at the same time v-if and v-for
  • When v-if And v-for When used together ,v-for Ratio v-if Higher priority .

"=" and "" and "=" The difference between

<body>
<!-- An equal sign Is the meaning of assignment It is mainly used for js Inside -->
<div id="app">
<!-- Use double isochron -->
<p v-if="num == '1' "> I am double equal to Double is equal to loosely Ordinary numbers 1 Can be equal to a string "1"</p>
<!-- Use third class because strNum Defined as character type 1 So it's not digital 1-->
<p v-if="strNum==='1'"> I am double equal to Double is equal to loosely Ordinary numbers 1 Can be equal to a string "1"</p>
<!-- Also used for other types of data eg Boolean and string Of ture Phase comparison -->
</div>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
new Vue({
el: "#app",
data: {
// Define an ordinary 1 Of a character type 1
num: 1,
strNum: '1'
},
})
</script>
</body>

Four .Vue Tab case

<body>
<!-- Tab body -->
<div id="app" class="tableCard">
<div id="" class="tableHead">
<ul>
<!-- Take tab data Traverse the title -->
<!-- defaultStyle If the sign id It's equivalent to traversing id Then add the default style -->
<li v-for="title in tableLists" :class="title.id===flagId?'defaultStyle':''">
<!-- Bind click event change Pass in the corresponding data id -->
<span v-on:click='change(title.id)'>{{title.title}}</span>
</li>
</ul>
</div>
<div id="" class="tableBody">
<!-- Take tab data Traverse the image path -->
<ul v-for="img in tableLists">
<!-- data id Equal to the sign id Let the picture show -->
<li v-if="img.id === flagId">
<img :src="img.path" v-bind:style="showImg">
</li>
<!-- What is not equal to is hidden -->
<li v-else>
<img :src="img.path">
</li>
</ul>
</div>
</div>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<!-- vue example -->
<script type="text/javascript">
new Vue({
el: "#app",
// Define image styles
data: {
flagId: 1,
showImg: "display: block;",
tableLists: [{
id: 1,
title: " tab 1",
path: "img/3Dbg01.jpg"
}, {
id: 2,
title: " tab 2",
path: "img/3Dbg02.jpg"
}, {
id: 3,
title: " tab 3",
path: "img/3Dbg03.jpg"
}, ]
},
methods: {
// Every click modifies flagId The value of is the value passed in
change: function(titleId) {
this.flagId = titleId;
}
}
})
</script>
</body>

Reference resources demo

giteehttps://gitee.com/li_shang_shan/vue-entry-instruction-demo

版权声明
本文为[The scenery of life]所创,转载请带上原文链接,感谢
https://qdmana.com/2020/11/20201129184818167b.html

  1. css单位
  2. CSS unit
  3. 前端验证集合
  4. Front end validation collection
  5. Front end learning (4) -- response line, response head, response body
  6. Lesson 27: using time measuring tools to explore available spare time
  7. CSS 单位
  8. CSS unit
  9. 前端工具集合
  10. Front end Tools Collection
  11. Introduction to HTTP message format
  12. Introduction to new features of HTML5
  13. Introduction of bootstrap Blazer component library
  14. HTML5 速览
  15. HTML5 quick view
  16. HTML表格自动排序
  17. For less than $1700, create a private cloud with openstack
  18. Basic learning of JavaScript (1)
  19. 前端编程之路一一HTML标签分类
  20. Front end Programming: HTML tag classification
  21. ColSpan and rowspan merging cells of HTML form elements
  22. JavaScript 日期时间格式化
  23. JavaScript date time formatting
  24. Classification of front end interview questions - html2
  25. CSS block elements
  26. HTML5 form detailed tutorial
  27. HTML5 form detailed tutorial
  28. HTML5新增的元素表
  29. New element table in HTML5
  30. 3D轮播插件vue-carousel-3d非官方最全文档
  31. 3D carousel plug-in vue-carousel-3d
  32. Uniapp (Vue general) integrates Tencent location service SDK -- multi platform small program general
  33. Slowhttptest slow attack tool use details
  34. HTML summary (2)
  35. Overview of CSS3
  36. Front end abnormal monitoring system
  37. 免费网站部署和免费数据库Serverless云存储资源汇总整理
  38. Free website deployment and collection of free database serverless cloud storage resources
  39. Vux form -- a form solution of base vux
  40. 可以直接用于HTML中的特殊字符表 unicode字符集
  41. Can be directly used in HTML special character table Unicode character set
  42. Detailed explanation of HTTP protocol
  43. HTTP request header and request response header
  44. CSS background深度解析
  45. Python web/HTML GUI
  46. Front end standard 2: HTML you know and don't know
  47. Some HTML tags
  48. HTML标签之table
  49. Table of HTML tag
  50. DataTables of jQuery plug-in
  51. Unity calls Google's free translation API (HTTPS interface). Young people don't speak martial arts. How can they speak in multiple languages
  52. Linux entry most commonly used commands, do not learn a bunch of useless commands
  53. Piziheng embedded: a list of common short-range wireless communication protocols (Wi Fi / Bluetooth / ZigBee / thread...)
  54. Naming rules for the front end team of ladder
  55. HTML logo related symbols
  56. Node . JS: development resources and technology stack arrangement
  57. Unity calls Google's free translation API (HTTPS interface). Young people don't speak martial arts. How can they speak in multiple languages
  58. Straighten out JavaScript (18) - statements and operators
  59. Employment information statistics network (interface document)
  60. css selector