- 博客(67)
- 资源 (1)
- 收藏
- 关注
原创 07_02 事件的基本事件
代码:<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>事件的基本事件</title> <script src="../js/vue.js"></script></head><body> <div id="root"> <h2>欢迎来到{{
2021-08-08 22:59:07 182
原创 07_01 键盘事件
代码:<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>键盘事件</title> <script src="../js/vue.js"></script></head><body> <div id="root"> <h2>欢迎来到{{nam
2021-08-08 22:45:02 156
原创 06_03 Vue中的数据代理
代码:<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>Vue中的数据代理</title> <script src="../js/vue.js"></script></head><body> <div id="root"> <h1>学校名称
2021-08-08 22:20:41 151
原创 06_02 何为数据代理
代码:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>什么是数据代理</title> <script src="../js/vue.js"></script> </head> <body> <!-- 数据代理:通过一个对象
2021-08-08 22:09:54 94
原创 06_01 回顾Object.defineProperty
代码:<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>回顾Object.defineProperty方法</title> <script src="../js/vue.js"></script></head><body> <script> let n
2021-08-08 22:06:41 95
原创 05_01 MVVM模板
代码:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>el和data的两种写法</title> <script src="../js/vue.js"></script> </head> <body> <div id="ro
2021-08-05 22:43:57 157
原创 04_01 el和data的两种写法
代码:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>el和data的两种写法</title> <script src="../js/vue.js"></script> </head> <body> <div id="
2021-08-05 22:32:09 140
原创 03_01数据绑定
代码:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>数据绑定</title> <script src="../js/vue.js"></script> </head> <body> <div id="root">
2021-08-05 22:20:25 241
原创 02_01Vue模板语法
代码:<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>模板语法</title> <script src="../js/vue.js"></script></head><body> <div id="root"> <h1>插值语法</
2021-08-05 22:10:20 72
原创 01_01初识Vue
代码:<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>初识Vue</title> <!-- 引入Vue --> <script type="text/javascript" src="../js/vue.js"></script></head><!-- Vue实例
2021-08-05 22:03:49 98
原创 06-事件渲染
1,实现页面:2,demo4.wxml<!-- 1 需要给input标签绑定input时间 绑定关键字 bindinput 2 如何获取输入框的值 通过事件源对象来获取 e.detail.value 3 把输入框的值复制到 data当中 不能直接 1 this.data.num=e.detail.value 2 this.num=e.detail.value 正确写法 this.setData({ num:
2021-05-20 23:10:05 203
原创 05-条件渲染
05-条件渲染<!--pages/demo3/demo3.wxml--><!-- 1,text 相当于以前web中的 span标签 行内元素 不会换行 2,view 相当于以前web中的 div标签 块级元素 会换行 3,checkbox就是以前的复选框标签 --><!-- <text>1</text><text>2</text><view>1</view>
2021-05-20 23:07:16 169
原创 04-block标签
04-block标签<!--pages/demo3/demo3.wxml--><!-- 1,text 相当于以前web中的 span标签 行内元素 不会换行 2,view 相当于以前web中的 div标签 块级元素 会换行 3,checkbox就是以前的复选框标签 --><!-- <text>1</text><text>2</text><view>1</view&
2021-05-20 22:10:41 592
原创 03-循环
03-循环<!--pages/demo3/demo3.wxml--><!-- 1,text 相当于以前web中的 span标签 行内元素 不会换行 2,view 相当于以前web中的 div标签 块级元素 会换行 3,checkbox就是以前的复选框标签 --><!-- <text>1</text><text>2</text><view>1</view>&
2021-05-19 23:08:19 87
原创 02-运算
02-运算1,demo3.wxml<!--pages/demo3/demo3.wxml--><!-- 1,text 相当于以前web中的 span标签 行内元素 不会换行 2,view 相当于以前web中的 div标签 块级元素 会换行 3,checkbox就是以前的复选框标签 --><!-- <text>1</text><text>2</text><view>1&l
2021-05-19 22:41:00 86
原创 01-数据绑定(如何在页面上显示数据)
01-数据绑定(如何在页面上显示数据)1,demo3-wxml<!--pages/demo3/demo3.wxml--><!-- 1,text 相当于以前web中的 span标签 行内元素 不会换行 2,view 相当于以前web中的 div标签 块级元素 会换行 3,checkbox就是以前的复选框标签 --><!-- <text>1</text><text>2</text>&
2021-05-19 22:30:30 278
原创 10-组件通信-子传父(自定义函数)
10-组件通信-子传父(自定义函数)<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>组建通信-子传父(自定义函数)</title></head><body> <!-- 父组件模板 --> <div id="app"> <cpn @item-click="c
2021-05-13 21:34:58 132
原创 09-组件通信-父传子(props的驼峰标识)
09-组件通信-父传子(props的驼峰标识)<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>组件通信-父传子(props的驼峰标识)</title></head><body> <div id="app"> <!-- 当props中用驼峰命名法时如cInfo,绑定时要改为v-
2021-05-13 21:34:15 132
原创 08-组件通信-父组件向子组件传递数据
08-组件通信-父组件向子组件传递数据<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>组建通信-父组件向子组件传递数据</title></head><body> <div id="app"> <cpn v-bind:cmovies="movies" :cmessage="me
2021-05-13 21:33:24 106
原创 07-组件中data为什么是函数
07-组件中data为什么是函数<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>组件中data为什么是函数</title></head><body> <div id="app"> <cnp></cnp> <cnp></cnp
2021-05-12 21:36:08 60
原创 06-组件中数据存放问题
06-组件中数据存放问题<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>组件模板的分离写法</title></head><body> <div id="app"> <cnp1></cnp1> </div> <!-- 方法一
2021-05-12 21:35:16 67
原创 05-组件模板的分离
05-组件模板的分离<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>组件模板的分离写法</title></head><body> <div id="app"> <cnp1></cnp1> </div> <!-- 方法一 --
2021-05-12 21:34:25 73
原创 04-注册组件的语法糖写法
04-注册组件的语法糖写法<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>注册组件的语法糖写法</title></head><body> <div id="app"> <!-- cpn1是全局组件,cpn2是局部组件 --> <cpn1>&l
2021-05-12 21:33:42 97
原创 03-父组件和子组件
03-父组件和子组件<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>父组件和子组件</title></head><body> <div id="app"> <cpn1></cpn1> <cpn2></cpn2> </di
2021-05-12 21:32:47 109
原创 02-全局组件和局部组件
02-全局组件和局部组件<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>全局组件和局部组件</title></head><body> <!-- 全局组件 --> <div id="app"> <cpn></cpn> <
2021-05-12 21:31:59 60
原创 异常处理
异常处理任务要求:(异常处理)定义Student类,含数据成员:name(姓名,String类型)、Score(成绩,整型),定义一个异常类:InvalidScore类当Score<0或>100时产生异常抛出。编写主类程序测试你的定义:录入学生姓名和成绩生成Sudent对象数组(可以使用ArrayList<>),当姓名录入为Null时终止录入;录入要求:当成绩录入异常时抛出InvalidScore异常并要求重新录入成绩。其他需要定义的方法自行确定,达到上述目的即可。1,Stud
2021-05-11 08:44:58 283
原创 01-组件化的基本使用
01-组件化的基本使用<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>组件化的基本使用</title></head><body> <div id="app"> <!-- 3,使用组件 --> <my-cpn></my-cpn>
2021-05-09 16:28:52 69
原创 06-v-model修饰符的使用
06-v-model修饰符的使用<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>v-model修饰符的使用</title></head><body> <div id="app"> <!-- 1,lazy修饰符 --> <!-- lazy修饰符可以让
2021-05-09 16:26:57 85
原创 05-v-bind结合select类型
05-v-bind结合select类型<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>v-model结合select类型</title></head><body> <div id="app"> <!-- 1,选择一个 --> <select nam
2021-05-09 13:47:39 442
原创 04-v-model结合checkbox类型
04-v-model结合checkbox类型<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>v-model结合CheckBox类型</title></head><body> <div id="app"> <!-- 1,CheckBox单选框 --> &l
2021-05-09 13:46:19 72
原创 03-v-model结合radio类型
03-v-model结合radio类型<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>03-v-model结合radio类型</title></head><body> <div id="app"> <label for="male"> <i
2021-05-09 13:45:05 101
原创 02-v-model的原理
02-v-model的原理<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>02-v-model的原理</title> <!-- v-model其实是一个语法糖,它的背后本质上是包含两个操作: 1,v-bind绑定一个value属性 2,v-on指令给当前元素绑定input事件 也就是说 <inp
2021-05-09 11:19:03 127
原创 01-v-model的基本使用
01-v-model的基本使用<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>01-v-model的基本使用</title> </head> <body> <div id="app"> <input type="text" v
2021-05-09 11:17:54 76
原创 高阶函数JS
高阶函数JS// 编程范式:命令式编程/声明式编程// 编程范式:面向对象编程(第一公民:对象)/函数式编程(第一公民函数)// js高阶函数的使用:filter/map/reduce// 1,filter// filter中的回调函数有一个要求:必须返回一个boolean值// true:当返回true是,函数内部会自动将这次回调的n加入到新的数组中// false:当返回false时,函数内部会过滤到这次的n// 11,22,33const nums = [11, 22,33, 33
2021-05-09 10:46:37 56
原创 书籍购物车案例
书籍购物车案例页面实现截图:HTML代码:<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>购物页面的搭建</title> <link rel="stylesheet" href="style.css"> <!-- <script src="main.js"></script> --&
2021-05-06 21:13:53 263
原创 05-v-bind动态绑定(对象语法)
05-v-bind动态绑定(对象语法)<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>v-bind绑定style</title></head><body> <div id="app"> <h2 :style="{fontSize:finalSize+'px',backgrou
2021-05-03 11:05:26 162
原创 04-v-bind和v-for的结合
04-v-bind和v-for的结合<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>v-bind和v-for的结合</title></head><div id="app"> <ul> <li v-for="(m,index) in movies">{{index}}-{
2021-05-03 10:53:29 112
原创 03-v-bind动态绑定(数组语法)
03-v-bind动态绑定(数组语法)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>v-bind动态绑定(对象语法)</title></head><div id="app"> <h2 class="title" :class="[active,line]">{{message
2021-05-03 10:47:24 529
原创 02-v-bind的动态绑定(对象语法)
02-v-bind的动态绑定(对象语法)<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>v-bind动态绑定(对象语法)</title> <style> .active { color: red; } .line { font-s
2021-05-03 10:39:56 237
原创 01-v-bind的基本使用
01-v-bind的基本操作<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>v-bind基本使用</title></head><body> <div id="app"> <!--错误的做法:这里不可以使用mustache语法--> <!--<
2021-05-03 10:37:54 189 2
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人