Tag:Purple smoke

  • Vs codenew code snippet Vue base code

    Time:2021-9-19

    Create a new code snippet for Vue using vscode 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 time Open vscode Click menu code = “preferences =” user code […]

  • Vue basic introduction notes 04: V-for

    Time:2021-9-18

    Vue basic introduction notes 04 Four cases of V-for array Array object object number A key is required in a component <!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”> <!– Array — > < p V-for = “(item, index) in list” > […]

  • Vue basic introduction notes 05: V-for, V-IF

    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 […]

  • Vue basic introduction note 07: filter

    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 […]

  • Vue basic introduction note 12: component switching

    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 […]

  • Vue basic introductory notes 14: comment demo

    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 […]

  • Vue basic introduction notes 15: ref

    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: […]

  • Introduction notes to Vue basics 17: two ways of routing parameters

    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 & […]

  • Vue basic introductory notes 18: naming views to achieve classic layout

    Time:2021-9-4

    Vue basic introductory notes 18: naming views to achieve classic layout <!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> <style> *,h1{ margin: 0; padding: 0 } .header{ width: 100%; height: 100px; background-color: red; } .left{ width: 30%; height: 500px; […]

  • Vue basic introductory notes 19: calculation properties and listening properties

    Time:2021-9-3

    Vue basic introductory notes 19: calculation properties and listening properties Brief introduction computedThe result of the attribute is cached and recalculated unless the dependent responsive attribute changes. It is mainly used as an attribute; methodsMethod represents a specific operation, mainly writing business logic; watchFor an object, the key is the expression to be observed, and […]

  • WeChat official account development 2: weixin-JS-sdk usage

    Time:2021-8-28

    In the previous article, we Vue was successfully introduced to facilitate the use of weui components. This article introduces how to use WeXin JS SDK. In the process of coding, I thought it would be very easy, because I used the laravel extension package easywechat before, but it backfired. I encountered a lot of trouble […]