- 博客(20)
- 收藏
- 关注
RSS订阅原创 Vue CLI
Review组件：is 属性的使用Prop：Prop 类型：[] - 数组类型，如：{ props: ['title', 'id', 'completed']}{} - 对象类型，如：{ props: { title: String, id: Number, completed: Boolean }}验证，如：{ props: { title: { type:
2020-07-03 17:09:31
127
原创 vue 组件通信 请求数据的三种方式
Review组件定义组件注册组件通信父子组件通信：父传子：使用 props子传父：使用事件跨组件通信：转换为父子组件通信的方式（繁琐）enent-bus （事件总线）事件总线借助一个中间对象，来实现数据的挂载及传递：以事件的方式实现，通过绑定自定义事件来挂载数据并处理数据，通过触发事件的执行来传递数据。借助的中间对象实际上是一个空的 Vue 实例const bus = new Vue()在需要接收数据的组件中绑定事件（入），使用 bus.$on(事件名称，事件处理程序)在需
2020-07-03 16:56:17
1385
原创 vue 组件
Reviewv-cloak解决页面第一次渲染闪烁问题。通常会结合 css 设置一起使用，<style> [v-cloak] { display: none; }</style><div v-cloak> {{ message }}</div>不会显示，直到编译结束。当创建完 Vue 实例，编译结束后，会自动将页面元素节点中的 v-cloak 属性删除。组件组件是 Vue 的核心结构在 Vue 里，
2020-07-03 16:52:50
1650
原创 vue 利用组件写待办事项
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>TodoList</title></head><body> <div id="app">
2020-07-03 16:51:20
839
原创 vue 待办事项案列
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>待办事项列表</title> <style> .completed { text-decorati
2020-07-03 16:48:19
794
原创 基础vue code
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>示例</title> <style> .active { color: #f00; }
2020-07-03 16:43:36
893
原创 Vue 入门
VueMVCModel - View - ControllerMVVMModel - View - ViewModel使用Vue 不支持 IE8 及以下版本，因为 Vue 使用了 IE8 无法模拟的 ECMAScript 5 特性。Object.defineProperty() – 数据劫持两种版本开发版本通常用于开发阶段，会在控制台抛出错误及警告信息生产版本用于生产环境 ，删除了警告直接引入使用 <script src=""> 引入本地引入：下载 vue.
2020-07-03 16:20:02
76
原创 vue 模板 计算 侦听 条件渲染 列表渲染
模板语法{{ expression }}v-text: 类似 .innerTextv-html: 类似 .innerHTMLv-bind: 属性绑定，不能使用 {{ }} 语法来绑定属性，而要使用 v-bind 指令，v-bind 可简写为 :v-on: 绑定事件，v-on:<event-name>="<event-handler>"，v-on 可简写为 @计算属性通常是根据已有的 data 数据，计算生成新的数据，把这种结构叫做计算属性，计算属性在 Vue 的选
2020-06-30 11:06:03
216
原创 swiper 轮播图 简单易上手
swiper 做轮播超级好用：cdn引入 <link href="https://cdn.bootcdn.net/ajax/libs/Swiper/5.4.2/css/swiper.min.css" rel="stylesheet"> <script src="https://cdn.bootcdn.net/ajax/libs/Swiper/5.4.2/js/swiper.min.js"></script> <script src="https:/
2020-06-20 16:25:51
150
原创 霓虹灯效果按钮
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>霓虹灯按钮悬停效果</title> </head> <style> body{ display:flex; justify-content: center;/* 弹性盒居个中 */ background-color: black; margin-top: 100
2020-06-20 16:11:09
230
原创 数组的方法，javascript基础必备技能
合并两个数组 - concat()array1.concat(array2)合并三个数组 - concat()array1.concat(array2, array3);用数组的元素组成字符串 - join()array1.join(',')//数组转字符串，并用,隔开删除数组的最后一个元素 - pop()array.pop()//删除最后一个元素数组的末尾添加新的元素 - push()array.push('a')//数组末尾添加a将一个数组中的元素的顺序反转排序 - rev
2020-06-08 19:14:58
104
原创 git方法
https://gitee.com/ ---- 国内服务器 https:/github.com/ ---- 国外服务器git init ---- 初始化(创建主分支)仓库git clone 拉取地址 ---- 克隆仓库git add ./ ---- 提交到本地暂存区git commit -m “本次提交注释” ---- 提交到本地仓库git status ---- 查看文件状态git pull ---- 拉取更新的代码git push origin master ---- 推送本地仓库代码到
2020-06-08 12:00:20
164
原创 原生js ajax 封装
首先我们先了解ajax的get和post请求分别是怎样请求数据的get请求 let ajx = new XMLHttpRequest() //创建ajax实例 /*打开需要请求的地址，可以有三个参数 参1：请求方式 参2：请求地址 参3：是否异步，可选，默认异步 */ ajx.open('get','http://localhost/day02/api/gouwu.php?name=zhan
2020-06-08 11:48:18
181
原创 js 取元素 创建元素 添加元素 添加属性
<style> *{ margin:0; padding:0; } .box{ width: 200px; height: 200px; background-color: #FF0000; } </style> <body> <div class="box">第一个盒子</div> <script> var box = document.querySelector('.
2020-06-05 13:15:30
581
原创 阻止默认事件
<script> var ul = document.createElement('ul') document.oncontextmenu = function(e) { e = e || window.event ul.style.position = 'absolute' ul.style.left = e.clientX + 'px' ul.style.top = e.clientY + 'px' ul.innerHTML = '<
2020-05-20 13:00:23
192
原创 模拟下拉菜单
芒果 西瓜 葡萄 哈密瓜 桃子 </body><script> var input =document.querySelector('input') var ul = document.querySelector('ul') var meats = document.querySelectorAll('li') input.onfocus = function(){...
2020-05-20 11:53:48
128
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人