vue2.0学习—键盘事件(三十三)(代码片段)

王同学要努力 王同学要努力     2022-12-09     586

关键词:

【Vue2.0学习】—键盘事件(三十三)

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="../js/vue.js"></script>
    <style>
        #root 
            margin-top: 20px;
        
    </style>
</head>
<!-- 
    
 -->

<body>
    <div id="root">
        <h1>我叫name6</h1>
        <input type="text" placeholder="按下回车键提示输入" @keyup.enter="show">
        <h1>我叫name4</h1>
        <input type="text" placeholder="按下回车键提示输入" @keyup.esc="show">
        <h1>我叫name1</h1>
        <input type="text" placeholder="按下回车键提示输入" @keyup.delete="show">
        <h1>我叫name2</h1>
        <input type="text" placeholder="按下回车键提示输入" @keyup.space="show">
        <h1>我叫name3</h1>
        <input type="text" placeholder="按下回车键提示输入" @keydown.tab="show">
        <!-- @keydown.tab  tab键特殊 必须配合keydown使用-->

    </div>

    <script>
        const vm = new Vue(
            el: "#root",
            data: 
                name1: '张三',
                name2: '李四',
                name3: '小吴',
                name4: '小王',
                name5: '小李',
                name6: '小明'
            ,
            methods: 
                show(e) 

                    console.log(e.target.value);


                
            

        )
    </script>
</body>

</html>

vue2.0学习—object.defineproperty(三十)(代码片段)

【Vue2.0学习】—Object.defineProperty(三十)<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metahttp-equiv="X-UA-Compatible 查看详情

vue2.0学习—条件渲染(三十九)(代码片段)

【Vue2.0学习】—条件渲染(三十九)一、v-for指令1、用于展示数据的列表2、语法:v-for="(item,index)"inXXX:key="yyyy"3、可遍历数组、对象、字符串、指定次数<divid="root"><h2>人员列表</h2... 查看详情

vue2.0学习—监视属性(三十五)(代码片段)

【Vue2.0学习】—监视属性(三十五)通过vm对象的$watch或watch配置来监视指定的属性当属性发生变化时,回调函数自动调用,在函数内部进行计算需求:做一个天气案例<!DOCTYPEhtml><htmllang="en">&l... 查看详情

vue2.0学习—理解数据代理(三十一)(代码片段)

【Vue2.0学习】—理解数据代理(三十一)什么是数据代理?通过一个对象代理对另一个对象中属性的操作(读/写)<script>letobj=x:100letobj2=y:200Object.defineProperty(obj2,'x',get()returnobj.x,set(val 查看详情

vue2.0学习—收集表单数据(四十三)(代码片段)

【Vue2.0学习】—收集表单数据(四十三)v-model的三个修饰符:lazy:失去焦点再收集数据number:输入字符串转为有效的数字trim:输入首尾空格过滤<body><divid="root"><form@submit.prevent="demo" 查看详情

vue2.0学习—计算属性(三十四)(代码片段)

【Vue2.0学习】—计算属性(三十四)定义:要用的属性不存在,要通过已有的属性得来原理:底层借助了Object.defineproperty方法提供的getter和setterget函数什么时候执行?初次读取时会执行当依赖的数据发生变... 查看详情

vue2.0学习—watch和computed对比(三十七)(代码片段)

【Vue2.0学习】—watch和computed对比(三十七)计算属性<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metahttp-equiv="X-UA-Compatible 查看详情

vue2.0学习—class与style绑定(三十八)(代码片段)

【Vue2.0学习】—class与style绑定(三十八)一、理解在应用界面中,某个元素的样式时变化的class/style绑定就是专门用来实现动态样式效果的技术二、class绑定:class='xxx'表达式是字符串:'classA'表达式是对... 查看详情

vue2.0学习—el与data的两种写法(三十六)(代码片段)

【Vue2.0学习】—el与data的两种写法(三十六)<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metahttp-equiv="X-UA-Compatible"conten 查看详情

机器学习100天(三十三):033kd树的python实现(代码片段)

《机器学习100天》完整目录:目录机器学习100天,今天讲的是:KD树的Python实现!打开spyder,我们新建一个kd_tree.py脚本。首先,我们新建一个类,名为Node,它定义了KD树节点中包含的数据结构。例如数据、深度、左节点、右节点... 查看详情

vue2.0学习—ref属性(五十三)(代码片段)

【Vue2.0学习】—ref属性(五十三)ref属性被用来给元素或子组件这些引用信息(id的替代者)应用在html标签上获取的是真实的DOM元素,应用在组件标签上是组件的实例对象(vc)使用方式:打标识:<h1ref... 查看详情

opencv学习三十三:pointpolygontest检测点是否在轮廓内(代码片段)

opencv函数pointPolygonTest:C++:doublepointPolygonTest(InputArraycontour,Point2fpt,boolmeasureDist)用于测试一个点是否在多边形中当measureDist设置为true时,返回实际距离值。若返回值为正,表示点在多边形内部,返回值为负&#x 查看详情

[系统安全]三十三.恶意代码检测基于机器学习的恶意代码检测技术(代码片段)

...,我重新开设了这个专栏,准备系统整理和深入学习系统安全、逆向分析和恶意代码检测,“系统安全”系列文章会更加聚焦,更加系统,更加深入,也是 查看详情

vue2.0的漫长学习ing-5(代码片段)

v-on:绑定事件监听器  v-on就是监听事件,可以用v-on指令监听DOM事件来触发一些javascript代码,也就是我们在js中常用的事件处理函数,同时在Vue中我们可以使用@来简写v-on。下面我们就简单写一个比赛加减分的例子。  <!DO... 查看详情

wpf学习第三十三章高级命令(代码片段)

  前面两章介绍了命令的基本内容,可考虑一些更复杂的实现了。接下来介绍如何使用自己的命令,根据目标以不同方式处理相同的命令以及使用命令参数,还将讨论如何支持基本的撤销特性。一、自定义命令  在5个命令... 查看详情

unity游戏框架搭建2019(三十三十一)menuitem显示顺序问题&类的提取(代码片段)

在上一篇,我们得出了两个核心的学习思路:根据问题去学习,并收集。主动学习,并思考适用场景。我们今天解决MenuItem显示顺序问题。目前MenuItem显示如图所示:我们来看下MenuItem这个属性构造的定义。第二个参数是,是否是验... 查看详情

vue2.0—键盘事件

【Vue2.0】—键盘事件(三) 查看详情

三十三modules(代码片段)

1:方法一:导入整个模块importmathclassModulesDemo():defbuiltin_modules(self):print(math.sqrt(100))m=ModulesDemo()m.builtin_modules()   方法二:只导入用到的部分frommathimportsqrtclassModulesDemo():defbuiltin_m 查看详情