Big front-end study notes -- Composition API
Composition API
1. Use of Composition API
1. Using Vue3.0
First create an empty folder, then enter the folder to execute npm init -y, then execute npm install vue@3.0.0-rc.1 to install vue3.0
Create index.html, use of vue3.0
<body>
<div id="app">
x: {{ position.x }} <br>
y: {{ position.y }} <br>
& ...
Posted by gukii on Mon, 16 May 2022 15:18:02 +0300
Vue -- instruction [learning notes] (continuously updated)
Vue – instruction [learning notes] (continuously updated)
Recorded Vue's study notes on the third day
v-show
Note that v-show does not support < template > elements or v-else.
Elements with v-show are always rendered and retained in the DOM. V-show simply switches the CSS property display of the element.
<div id=" ...
Posted by sp2hari on Sun, 15 May 2022 16:06:14 +0300
Vue integrated QQ login [server-side mode] [Oauth2 code mode]
Apply for QQ Internet Login
Document address: [QQ login] OAuth2.0 development document.
Apply for an application address Precautions:
Add a QQ login button on the homepage of the website (how to add it will be explained below)
The website information is consistent with the record information
model
This article uses the server-sid ...
Posted by rrijnders on Sun, 15 May 2022 10:42:06 +0300
Vue.js basic syntax introductory statement Vue learning notes v-model bidirectional data binding
Vue.js basic grammar, introductory statements, Vue learning notes
Learning website: https://www.bilibili.com/video/BV15741177Eh
vue experience
Responsive: once the data changes, the view will respond to the change
el: specifies which element this Vue object is attached to
Data: this attribute usually stores some data <div id="app"&g ...
Posted by IMP_TWI on Sat, 14 May 2022 13:40:34 +0300
v-on instruction and its parameter passing and modifier
v-on
1. Foundation
Official document link https://cn.vuejs.org/v2/api/#v-on
Function: binding event listening. The event type is specified by the parameter. The expression can be the name of a method or an inline statement, and can be omitted if there is no modifier.
Expected: Function | Inline Statement | Object
Syntax:
<di ...
Posted by yellowepi on Fri, 13 May 2022 07:48:51 +0300
Getting Started with Vue - Form Input Binding
Basic usage
You can create two-way data bindings on form , and elements using the v-model directive. It automatically picks the correct method to update the element based on the control type. Although somewhat magical, v-model is essentially syntactic sugar. It is responsible for listening to user input events to update data, and does some ...
Posted by davidppppppppppp on Tue, 10 May 2022 19:53:09 +0300
65. Complete the development of qunar.com App home page of Vue project (source: muke.com)
2020 / 10 / 21, Wednesday, today is another day of struggle.
@Author: Runsen @Date: 2020/10/21
Write in front: I am "Runsen". I love technology, open source and programming. Technology is open source and knowledge is shared. Turning the big four algorithm to the front end requires the accumulation of every day and refuelin ...
Posted by NeoGeo on Tue, 10 May 2022 12:52:42 +0300
Vue learning 29_ Installation of Devtools in Vue and several core concepts of vuex
Properties of Vue status management
When using vue, vue provides us with a browser plug-in Devtools to track the operation of vue, which provides great convenience for us to use vue for development. There are two installation methods: one is to install in the online store of Google browser, click the menu in the upper right corner of the brows ...
Posted by PnHoPob on Tue, 10 May 2022 08:57:30 +0300
Vue route lazy load
Vue route lazy load
For SPA single page applications, when they are packaged and built, the JavaScript package will become very large, affecting the page loading speed. The components corresponding to different routes will be divided into different code blocks, and then the corresponding components will be loaded when the routes are accessed. ...
Posted by Bullit on Tue, 10 May 2022 04:01:06 +0300
vue core interview question: vue parent-child component life cycle call sequence
1, Order
1. Load render pass
Parent beforecreate - > parent created - > parent beforemount - > child beforecreate - > child created - > child beforemount - > child mounted - > parent mounted
2. Sub component update process
Parent BeforeUpdate - > child BeforeUpdate - > child updated - > parent updated
3. Paren ...
Posted by CodeBuddy on Mon, 09 May 2022 23:06:28 +0300