- 博客(235)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 Vue入门到放弃25(vue路由--router)
什么是路由1.后端路由：对于普通的网站，所有的超链接都是URL地址，所有的URL地址都对应服务器上对应的资源；2.前端路由：对于单页面应用程序来说，主要通过URL中的hash(#号)来实现不同页面之间的切换，同时，hash有一个特点：HTTP请求中不会包含hash相关的内容；所以，单页面程序中的页面跳转主要用hash实现；3.在单页面应用程序中，这种通过hash改变来切换页面的方式，称作前...
2019-12-11 19:16:26
412
原创 Vue入门到放弃24(vue获取DOM元素和组件--ref和$refs的使用)
ref 有三种用法： 1、ref 加在普通的元素上，用this.ref.name 获取到的是dom元素 2、ref 加在子组件上，用this.ref.name 获取到的是组件实例，可以使用组件的所有方法。 3、如何利用 v-for 和 ref 获取一组数组或者dom 节点$refs $refs是一个对象，持有已注册过ref的所有的子组件。普通方式 我们...
2019-12-11 17:11:53
424
原创 Vue入门到放弃23(vue案例--评论列表)
基础页面<body> <div id="app"> <ul class="list-group"> <!--循环取出列表数据--> <li class="list-group-item" v-for="(item ,i) in list" :key="item.id"...
2019-12-11 16:31:15
408
原创 Vue入门到放弃22(vue组件-父子组件传值)
Vue父子组件传值父组件传值给子组件2.效果实现1.父组件，可以在引用子组件的时候， 通过属性绑定（v-bind:） 的形式, 把 需要传递给 子组件的数据，以属性绑定的形式，传递到子组件内部，供子组件使用2.在子组件中有个props属性，该属性中保存的都是 父组件传递给子组件的数据，注意：props 中的数据，都是只读的，无法重新赋值3.我们在子组件中使用在...
2019-12-10 18:16:45
200
原创 Vue入门到放弃21（组件-切换案例）
一、通过v-if控制实现 首先我们通过前面介绍的v-if标签来实现下这种效果1.创建组件 创建我们需要的两个全局组件，并通过标签使用。<body> <div id="app"> <a href="" @click.prevent="flag=true">登录</a> <a ...
2019-12-10 17:08:44
251
原创 Vue入门到放弃20（Vue的data和methods属性）
1. 组件可以有自己的 data 数据2. 组件的 data 和 实例的 data 有点不一样,实例中的 data 可以为一个对象,但是 组件中的 data 必须是一个方法3. 组件中的 data 除了必须为一个方法之外,这个方法内部,还必须返回一个对象才行;4. 组件中 的data 数据,使用方式,和实例中的 data 使用方式完全一样!!!<body> <di...
2019-12-10 15:49:36
257
原创 Vue入门到放弃19（Vue组件）
定义Vue组件什么是组件： 组件的出现，就是为了拆分Vue实例的代码量的，能够让我们以不同的组件，来划分不同的功能模块，将来我们需要什么样的功能，就可以去调用对应的组件即可；组件化和模块化的不同：+模块化： 是从代码逻辑的角度进行划分的；方便代码分层开发，保证每个功能模块的职能单一；+组件化： 是从UI界面的角度进行划分的；前端的组件化，方便UI组件的重用；全局组件定义的...
2019-12-10 11:59:09
240
原创 Vue入门到放弃18（Vue列表动画-添加删除）
https://cn.vuejs.org/v2/guide/transitions.html#列表过渡Vue动画案例使用transition-group标签<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name...
2019-12-10 10:58:07
190
原创 Vue入门到放弃17（Vue中的半场动画）
JavaScript 钩子<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <...
2019-12-09 18:03:37
139
原创 Vue入门到放弃16（Vue中的动画）
无动画：<body> <div id="app"> <input type="button" value="toggle" @click="flag=!flag"> <!-- 需求： 点击按钮，让 h3 显示，再点击，让 h3 隐藏 --> <h3 v-if="flag">这是一个H3</h3&g...
2019-12-09 17:40:00
171
1
原创 Vue入门到放弃15（vue-resource 示例之 vue对数据库数据增删查）
数据列表接口查询： 地址 http://www.liulongbin.top:3005/api/getprodlist 作用描述 获取品牌数据json数据 请求方式 Get 传入api的参数 无 返回数据格...
2019-12-09 16:23:34
404
原创 Vue入门到放弃14（vue-resource 实现 get, post, jsonp请求）
除了 vue-resource 之外，还可以使用`axios`的第三方包实现实现数据的请求（`axios`不支持跨域请求）引入vue-resource<script src="js/vue.js"></script><script src="js/vue-resource.js"></script>基本语法引入vue-re...
2019-12-09 14:59:15
178
原创 Vue入门到放弃13（vue实例的生命周期）
vue实例的生命周期什么是生命周期：从Vue实例创建、运行、到销毁期间，总是伴随着各种各样的事件，这些事件，统称为生命周期！ 生命周期钩子：就是生命周期事件的别名而已； 生命周期钩子 = 生命周期函数 = 生命周期事件 主要的生命周期函数分类： 创建期间的生命周期函数： beforeCreate：实例刚在内存中被创建出来，此时，还没有初始化好 data 和 methods 属性 ...
2019-12-06 17:33:58
166
原创 Vue入门到放弃12(自定义指令)
Vue自定义指令语法： Vue.directive('focus', { bind: function (el) {}, inserted: function (el) {}, updated: function (el) { } })注意：Vue中所有的指令，在调用的时候，都以v-开头使用Vue.directiv...
2019-12-06 16:05:12
154
原创 Vue入门到放弃11(按键修饰符)
系统修饰键 系统本身给我们提供的有几个修饰键，我们先来使用下(https://cn.vuejs.org/v2/guide/events.html)。自定义修饰键 系统提供的修饰键，就那么几个，这时如果我们想要自定义的话第一种方式就是使用按键对应的值来处理(https://dpb-bobokaoya-sm.blog.csdn.net/article/details/9628...
2019-12-06 15:13:49
138
原创 Vue入门到放弃10(过滤器应用-时间格式字符串格式化)
过滤器应用-时间格式字符串格式化// 全局的过滤器， 进行时间的格式化 // 所谓的全局过滤器，就是所有的VM实例都共享的 Vue.filter('dateFormat', function (dateStr, pattern = "") { // 根据给定的时间字符串，得到特定的时间 var dt = new Date(dateStr)...
2019-12-06 11:38:56
178
原创 Vue入门到放弃09（ Vue过滤器）
过滤器概念： Vue.js 允许你自定义过滤器，可被用作一些常见的文本格式化。过滤器可以用在两个地方：mustache 插值和 v-bind 表达式。过滤器应该被添加在 JavaScript 表达式的尾部，由“管道”符指示(" | ")；分类：过滤器分为全局过滤器和局部过滤器(私有过滤器)1.全局过滤器 我们先通过案例来介绍下过滤器的使用，然后再看下何为全局过滤器过滤器...
2019-12-06 10:28:01
425
原创 Vue入门到放弃08（Vue小案例添加，删除，搜索）
1.添加 <script src="./lib/vue-2.4.0.js"></script> <link rel="stylesheet" href="./lib/bootstrap-3.3.7.css"> <body> <div id="app"> <div class="panel panel...
2019-12-04 17:23:07
203
原创 Vue入门到放弃08（Vue条件判断 v-if，v-else-if，v-else）
v-if和v-else<body> <div id="app"> <h5>Modeng 是怎么样的一个人？</h5> <div v-if="isHandsome">非常帅</div> <div v-else>还是帅</div> <...
2019-12-04 15:37:37
161
原创 Vue入门到放弃07（Vue v-if和v-show差异）
<body> <div id="app"> <!-- <input type="button" value="toggle" @click="toggle"> --> <input type="button" value="toggle" @click="flag=!flag"> <!-- v...
2019-12-04 15:19:14
129
原创 Vue入门到放弃06(Vue v-for)
<body> <div id="app"> <!-- 原始操作 --> <p>{{list[0]}},{{list[1]}}、、、</p> <p v-for="item in list">{{item}}</p> <p v-for="(item, i)...
2019-12-04 14:37:01
114
原创 Vue入门到放弃05(Vue样式处理class、style)
在Vue中使用样式使用class样式 数组<h1 :class="['red', 'thin']">这是一个邪恶的H1</h1> 数组中使用三元表达式<h1 :class="['red', 'thin', isactive?'active':'']">这是一个邪恶的H1</h1> 数组中嵌套对象<h1 :c...
2019-12-02 20:14:02
172
原创 Vue入门到放弃04（Vue指令之v-model和双向数据绑定（简易计算器实现））
Vue指令之v-model<body> <div id="app"> <h4>{{ msg }}</h4> <!-- v-bind 只能实现数据的单向绑定，从 M 自动绑定到 V， 无法实现数据的双向绑定 --> <!-- <input type="text" v-bind:value=...
2019-11-21 17:21:56
120
原创 Vue入门到放弃03(Vue事件修饰符详解)
事件修饰符： .stop 阻止冒泡 .prevent 阻止默认事件 .capture 添加事件侦听器时使用事件捕获模式 .self 只当事件在该元素本身（比如不是子...
2019-11-21 16:54:20
184
原创 Vue入门到放弃02(Vue跑马灯效果案例)
Vue跑马灯效果1.分析a.点击"加油"按钮绑定一个点击事件，使用v-on或者缩写:"@"b.在按钮的事件处理函数中，写相关的业务逻辑代码：拿到 msg 字符串，然后 调用 字符串的 substring 来进行字符串的截取操作，把 第一个字符截取出来，放到最后一个位置即可；c.为了实现点击下按钮，自动截取的功能，需要把 2 步骤中的代码，放到一个定时器中去；2.实现2.1 绑定...
2019-11-21 16:35:40
225
原创 Vue入门到放弃01(基础入门)（vue介绍与入门）详解
什么是Vue.jsVue.js 是目前最火的一个前端框架，React是最流行的一个前端框架（React除了开发网站，还可以开发手机App， Vue语法也是可以用于进行手机App开发的，需要借助于Weex）Vue.js 是前端的主流框架之一，和Angular.js、React.js 一起，并成为前端三大主流框架！Vue.js 是一套构建用户界面的框架，只关注视图层，它不仅易于上手，...
2019-11-21 14:26:21
267
原创 微信分享网页时自定义标题、描述和图片
目的：微信浏览器分享网页自定义标题、描述和图片 效果：pc端： 手机端： 自定义：原始方法：（废弃）<body> <!--此图片必须放在body标签的最前面，且高度必须为屏幕...
2019-11-14 18:14:33
1578
原创 CSS旋转动画（jQuery添加class）
<script> $("#p2 .p2_div_four").hover(function () { $(this).find("img").addClass('p2_div_four_hover'); }, function () { $(this).find("img").removeClass('p2_div_four_hover...
2019-10-25 12:09:12
361
原创 一起来看源代码-01TreeMap添加操作
##前言之前很多小伙伴问我怎么看源代码,还有就是越来越多的程序员都想要看源代码,搞懂底层原理,但是感觉源代码非常的晦涩难懂,不够直接和清晰,所以我希望这篇文章能够快速带同学们看懂java源码,更加深入的学习java,帮助小伙伴们节约学习的时间成本.##1.树的介绍什么是树结构?其实就是一个节点下面有多个子节点,我们称之为树结构,如下图:普通节点：拥有子节点的节点。叶子节点...
2019-10-18 17:56:53
136
原创 JS控制页面加载（当页面滚动到某个地方才加载）
$(function () { var flag = 0;//控制加载次数 window.onscroll = function () {//页面滚动事件 if(flag == 0){ ...
2019-10-14 15:14:15
993
原创 PHP导出excel表格（可多表）SQL
function active($xlsName='', $xlsCell=array(), $xlsModel=''){ // 合计人数 // $fileName = "国庆活动"; // $headArr = array('ID', '姓名','电话','所属班级','成功人数','确认签字'); // $grade = M('active_fri...
2019-09-30 10:57:45
415
原创 前台验证电话或姓名重复（jquery绑定input的change事件）
//引入jQuery<script src="js/jquery-3.2.1.min.js" type="text/javascript" charset="utf-8"></script>//表单信息<form action="" method="post"> <input type="text" id="tel"> ...
2019-09-30 10:42:07
225
原创 CSS 去掉input默认样式
CSS 去掉input默认样式input{ background:none; outline:none; border:none;}如果input必须要有边框，但需要去掉选中时的蓝色框，则：input{ background:none; outline:none; border:1px solid #ccc...
2019-09-25 14:49:55
418
原创 vue文件说明(三)——文件内部内容说明
index.htmlindex.html可以理解为一个web页面容器，挂在main.js定义的根节点，内容有组件填充。App.vueApp.vue是根组件，有三部分组成，分别为模板，脚本，样式模板中定义了一个根节点(id为app)。<router-view>路由页面，可以理解为插槽，路由的页面都为加载此处。附加：<template>&...
2019-08-19 12:00:52
479
原创 vue项目结构(二)——项目结构说明
简单介绍目录结构build是一些webpack的文件，配置参数什么的，一般不用动config是vue项目的基本配置文件node_modules是项目中安装的依赖模块src 源码文件夹，基本上文件都应该放在这里。—assets 资源文件夹，里面放一些静态资源（图片）—components这里放的都是各个组件文件router路由配置—App.vue 组件—main.js入口文件stati...
2019-08-19 11:36:52
224
原创 vue环境配置(一)——安装（node.js）
一、安装node.js说明：安装node.js的windows版本后，会自动安装好node以及包管理工具npm，我们后续的安装将依赖npm工具。node.js的官方地址为：https://nodejs.org/en/download/，如下图所示：二：安装三：设置nodejs prefix（全局）和cache（缓存）路径1、在nodejs安装路径下，新建node_g...
2019-08-16 15:56:45
266
原创 PHP生成二维码图片
/** * php插件生成二维码demo * @return string */ public function create_code_php_code(){ $url='http://kid.ngrok.xiaomiqiu.cn/index.php/portal/index/share_two';//将url地址写好 V...
2019-07-31 15:12:33
160
原创 微信公众号（九）——生成带参数的二维码
https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1443433542/** * 微信生成二维码 */ public function share_by_wx_code(){ $a = new IndexController(); $access_token = $...
2019-07-31 15:03:39
591
原创 微信公众号（八）——关注时自动回复（文字 图片）
微信监听到事件后回调到到我们公众号配置好的接口地址/** * 配置Token！！！ */ public function home(){ $signature = $_GET["signature"]; $timestamp = $_GET["timestamp"]; $nonce = $_GET["nonce"]...
2019-07-26 18:42:38
2511
原创 微信公众号（七）——解决token配置的终极方法
刚开始配置token老是不成功，baidu了N种方式，都没有处理好；东拼西凑整了一个终极办法 /** * 配置Token！！！ */ public function home(){ $signature = $_GET["signature"]; $timestamp = $_GET["timestamp"]; $n...
2019-07-26 17:38:35
309
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人