Vue.js的学习记录_5

淩亂°似流年 2022-03-09 17:21 407阅读 0赞

### 数据绑定的两种方式 ###

*  Vue.html

<!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>Event KeyBoard</title>
        <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    </head>
    <body>
        <h1>Event KeyBoard</h1>
        <div id="Vue-app">
            <label for="">name</label>
            <input type="text" v-model="name">
            <span>{
       {name}}</span>
            <label for="">Age</label>
            
            <input type="text" v-model="age">
            <span>{
       {age}}</span>
        </div>
        <script src="app.js"></script>
    </body>
    </html>

*  Vue.js

new Vue({ 
        el: '#Vue-app',
        data: { 
            name:'',
            age: ''
        },
        methods: { 
            logName: function() { 
                console.log('You entered your name');
            },
            logAge: function() { 
                console.log('You entered your age');
            }
    
        }
    })

### `记录` ###

*  学习使用v-model绑定数据，并进行显示出来。

发表评论取消回复

表情：

评论列表（有 0 条评论，407人围观）

还没有评论，来说两句吧...

相关阅读

相关 Vuejs——（5）v-on

资料来于官方文档： http://cn.vuejs.org/guide/events.html 本文是在官方文档的基础上，更加细致的说明，代码更多更全。简单来说，

悠悠/ 2022年07月18日 00:13/ 0 赞/ 150 阅读

相关 Python学习记录day5

1.多层装饰器多层装饰器的原理是，装饰器装饰函数后，其实也是一个函数，这样又可以被装饰器装饰。编译是从下至上进行的，执行时是从上至下进行。 !/usr/bi

清疚/ 2022年07月14日 04:45/ 0 赞/ 226 阅读

相关 vuejs初次学习入门

不得不说我对前端技术还是有追求的，这几天了解了下vuejs，记点笔记 vuejs是一个mvvm框架，博主以java开发为主，后台的mvc模式可以说是web开发的标配，没想

今天药忘吃喽~/ 2022年07月11日 07:29/ 0 赞/ 281 阅读

相关 VueJs学习汇总

最近更新时间：2017年6月2日16:58:06 [《我的博客地图》][Link 1] 前端的框架很多，需要不断的摸索和学习，截止20170602已经接触和使

落日映苍穹つ/ 2022年06月15日 12:11/ 0 赞/ 451 阅读

相关 vuejs学习笔记

把一个对象所有元素打印出来对象： editRoomData: { id: "", roomNo:""

Bertha 。/ 2022年05月01日 12:10/ 0 赞/ 230 阅读

相关 Objc基础学习记录5

[Objc基础学习记录5][Objc_5] NSMutableString类继承的NSString类. NSMutableString是动态的字符串. 1.ap

逃离我推掉我的手/ 2022年04月23日 00:16/ 0 赞/ 149 阅读

相关 Vue.js的学习记录_5

数据绑定的两种方式 Vue.html <!DOCTYPE html> <html lang="en"> <head> <m

淩亂°似流年/ 2022年03月09日 17:21/ 0 赞/ 408 阅读

相关 2019/5/7 学习记录

[P4718 【模板】Pollard-Rho算法][P4718 _Pollard-Rho] [大数质因解：浅谈Miller-Rabin和Pollard-Rho算法][Mil

雨点打透心脏的1/2处/ 2022年02月04日 11:55/ 0 赞/ 249 阅读

相关【Vue 学习】- VueJS 生命周期

一、概述 Vue 的生命周期可以分为 8 个生命周期的执行点，从 new 创建 Vue 对象到对象的销毁，其中 4 个基本的，4 个特殊的，在下图中，红色标注的就是 8

向右看齐/ 2021年09月21日 01:16/ 0 赞/ 457 阅读

相关【Vue 学习】- VueJS 简单入门

目录一、概述 1、Vue 介绍 2、MVVM 模式二、Vue 入门 1、使用 IDEA 开发 Vue 2、插值表达式 --------------------

末蓝、/ 2021年09月21日 00:52/ 0 赞/ 761 阅读