After the value of the vue subcomponent is changed, a prompt will be given to confirm the change. Confirm and then change the value in the input box
Main idea: when the text box gets the focus, first assign the previous value to a variable, then click the confirm button to send the value to the parent component, and click the Cancel button to return the previous old value to the parent component.
Substandard components
<template>
<!-- i ...
Posted by kreoton on Tue, 04 Feb 2020 09:09:59 -0800
vue.js parent-child component communication
Today, let's look at the communication between the parent and child components of vue.js
In vue.js, the child component cannot directly access the properties of the parent component, and props is needed to pass the data
for instance:
<!DOCTYPE html>
<html lang="en">
<head>
&l ...
Posted by Scud on Sat, 01 Feb 2020 06:26:12 -0800
Learning summary of custom instruction in Vue
In addition to the built-in instructions (v-show,v-model), vue allows us to customize the instructions
To create a custom instruction, register the instruction (take the input box to get the focus as an example)
1, Register global directives:
// Register a global custom instruction ` v-focus`
Vue.directive('focus', {
// Wh ...
Posted by zapa on Fri, 31 Jan 2020 12:16:20 -0800
Details and examples of Vue's ref
Although there are prop s and events, sometimes you may need to access a subcomponent directly in JavaScript. To do this, you can assign an ID reference to this subcomponent through the ref feature. Ref can be added to the parent component or the child component, and can be accessed through this.refs instance. The following example implements t ...
Posted by xyn on Fri, 31 Jan 2020 08:53:20 -0800
The correct posture of the element UI form validation data
The correct posture of the element UI form validation data
Familiarity needs to be verified. The verification conditions are
Must fill in
Must be a number
Range 0 - 100
Refer to the official documentation of the ElementUI. You can have the following validation rules to verify the first condition:
rules: {
acquaintance: ...
Posted by hawkeyes on Fri, 31 Jan 2020 07:18:55 -0800
Shopping cart settlement function JS
Shopping cart settlement function
Layout:
<ul>
<li></li>
<li></li>
<li></li>
............
</ul>
<p><p>
Each li label represents that there are + - product quantity function in each product unit price and subtotal
What is the most expensive pr ...
Posted by Zoud on Fri, 31 Jan 2020 05:42:27 -0800
Initial knowledge of Vue (slot used in Vue)
Slot used in Vue
Case: part of the content in the child component is displayed according to the DOM passed from the parent component
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Vue Slot used in(slot)</title>
<script src="./vue.js"></script>
</head ...
Posted by st89 on Thu, 30 Jan 2020 20:43:21 -0800
Web front-end knowledge combing -- Javascript common syntax
JavaScript, like HTML and CSS, is the three necessary modules for Web front-end development. In addition, JavaScript is also the basic language of Vue, Ext, jQuery and other frameworks, so the learning of JavaScript is crucial. In fact, after learning the C + + language and Java, I feel that the basi ...
Posted by smiley_kool on Wed, 29 Jan 2020 21:06:05 -0800
Vue learning notes calculation properties VS listener VS method
For any complex logic, you should use computational properties, the official website says.
computed:
Directly use the name of the calculated property as the variable name.
Calculated properties are cached based on their dependencies. A computed property is re evaluated only if its associated dependency changes.
That is, w ...
Posted by Ironmann00 on Mon, 27 Jan 2020 08:59:36 -0800
Remake a todolist using vue cli
First, enter the project directory and start the project npm run start / npm run dev with the command [please refer to the package.json file in the project directory]
(where the x.vue file is a single file component)
Next, change the single file component x.vue
Note that the vue syntax requires that the. vue file, in the < ...
Posted by brash on Mon, 27 Jan 2020 08:31:31 -0800