zTree 是一个依靠 jQuery 实现的多功能 “树插件”。优异的性能、灵活的配置、多种功能的组合是 zTree 最大优点。 上篇文章给大家介绍了vue中如何使用ztree,大家可以点击查看。 之前博客介绍过怎么在vue里展示以及获取点击元素的内容,此文章之介绍搜索功能 html <el-form-item label="机构" class="ztree-par"> <i class="icon_org"></i> <input type="text" placeholder="请输入机构" id="ser" v-model="ruleForm.mechanism" @k...
团队开发的项目,如果没有对代码风格作要求,有多少团队成员,就当然会出现多少种不同的代码风格。因此,我们需要一种能够统一团队代码风格的工具,作为强制性的规范,统一整个项目的代码风格。 幸好,我们有 eslint 和 prettier 。 eslint VS prettier 应该大多数项目都已经采用eslint来对代码进行质量检查,可能少部分还会采用其进行一定程度上的统一风格。那为什么还需要prettier呢?我们先来对它们作一个简单的了解。 各种lint...
下面通过一段代码给大家介绍vue watch的普通监听和深度监听,具体代码如下所示: var vm=new Vue({ data:{ num:1, obj:{ name:三儿, age:21, sex:女 } }, watch:{ num(val, oldVal){ //普通的watch监听 console.log(“num: “+val, oldVal); }, obj:{ //深度监听,可监听到对象、数组的变化 handler(val, oldVal){ console.log(“obj.name: “+val.name, oldVal.name); }, deep:true } } }) vm.num=2 vm.obj.name=二儿 下面单...
第一个浅度监听: <!DOCTYPE html> <html><head><meta charset="UTF-8"><title></title><script type="text/javascript" src="js/vue.js"></script></head><body><div id="app"><p>{{a}}</p><p>{{b}}</p></div><script>var vm=new Vue({el:"#app",data:{a:10,b:15}});vm.$watch("a",function(){alert(a变化了);this.b=100;});document.onclick=function(){vm.a=2}</script></body> </html>第二个深度监听 <!DOCTYPE html> <html><...
本文实例为大家分享了jQuery轮播图实例的具体代码,供大家参考,具体内容如下1、html+css+js代码 <!DOCTYPE html> <html> <head><title></title><style type="text/css">*{margin: 0;padding: 0;text-decoration: none;}body{padding: 20px;}#container{min-width: 1000px;/*width: 1300px;*/height: 400px;overflow: hidden;position: relative;margin: 0 auto;}#list{/*width: 9100px;*/height: 400px;position: absolute;z-inde...
什么是 better-scroll better-scroll 是一个移动端滚动的解决方案,它是基于 iscroll 的重写,它和 iscroll 的主要区别在这里 。better-scroll 也很强大,不仅可以做普通的滚动列表,还可以做轮播图、picker 等等。 <template><div><div class="goods"><div class="menu-wrapper" ref="menuWrapper"></div><div class="food-wrapper" ref="foodWrapper"></div></div></div> </template>与1.0版本不同的是,我们使用的是ref <script ...
本文实例讲述了JavaScript引用类型Function。分享给大家供大家参考,具体如下: Function类型 函数是对象,函数名是指针:每个函数都是Function类型的实例。由于函数是对象,因此函数名是一个指向函数对象的指针,不会与某个函数绑定,一个函数可能会有多个名字。 function getSum(a, b) {return a + b; } alert(getSum(2, 3));//5 var copy = getSum; alert(copy(2, 3));//5 getSum = null; alert(copy(2, 3));//5定义函数的方式有...
前言 这篇文章基于我在公司内部分享会整理而成。欢迎探讨补充。补充一:看来很多人没看完文章就评论了。我在文章末尾说了,是不写 for 循环,不是不用 for 循环。简单陈述不写 for 循环的理由:for 循环易读性差,而且鼓励写指令式代码和执行副作用。更多参考这篇文章补充二:回应大家的一些反对意见。本来准备专门写文章回应的,但是没时间,就简短回复,直接扔链接了。 1、for 循环性能最好。回应:微观层面的代码性能优化,不是...
1.GET 请求 //向具有指定ID的用户发出请求 axios.get(/user?ID=12345) .then(function (response) { console.log(response); }) .catch(function (error) { console.log(error); }); // 也可以通过 params 对象传递参数 axios.get(/user, { params: { ID: 12345 } }) .then(function (response) { console.log(response); }) .catch(function (error) { console.log(error); });2.POST请求 axios.post(/user, { firstName: Fred, l...
搜索框实现搜索一个ul列表中的指定关键词的li。 html代码: <ul class="todo-content"> <li class="todo-ltem"><div class="todo-tip"><p>fhasjfas</p></div><div class="todo-btnlist"><button class="btn-finish">完成</button><button class="btn-finish">修改</button><button class="btn-finish">删除</button></div></li><li class="todo-ltem"><div class="todo-tip"><p>fhasjfas</p></div><div class="todo-btnlist"><...
应用场景: 我们应该经常见到系统中出现列表,会有一个对列表数据的操作(如删除, 修改,查看等)。我们可以在每个列表项后面加一个删除按钮,把列表项的相关参数(如 id)post到后台进行删除。当然如果你每次只要删除一两条数据这样子做并没有什么问题,但是如果你需要一次性删 除100条,你还去一条 条的删除吗?每一次删除10条会不会更好些呢? 好了,接下来。我们就使用jQuery解决这个问题。 首先,假设我们需要删除5个列表项。...
本文实例讲述了JS正则表达式常见用法。分享给大家供大家参考,具体如下: 前言:正则表达式(regular expression)反反复复学了多次,学了又忘,忘了又学,这次打算把基本的东西都整理出来,加强记忆,也方便下次查询。 学习正则表达式之前首先需要掌握记忆这些基本概念: 1.元字符:(.,\w,\W,\d,\D,\s,/S,^,$,)字符含义.匹配除了换行符以外的任意字符。\s代表任意空白符(换行符,制表符,空格)\S匹配任意非空字符串\b匹配单词边界,匹配...
在工作中,我们经常会写出这种代码: import MHeader from ../../components/m-header/m-header @import "../../common/stylus/variable" @import "../../common/stylus/mixin"即,需要引入公共文件,但是公共文件的文件路径里当前文件很远,那么就会形成上面示例中的那种路径很长的情况。 而因为文件目录是约定俗成的,不可轻易更改,无法修改相对路径。那么该怎么办呢? 大家都知道,Vue中的js可以通过配置webpack别名(alias)来...
外部引入 <link href="https://cdn.bootcss.com/animate.css/3.5.2/animate.min.css" rel="stylesheet"> <link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> <script type="text/javascript" src="../js/vue-2.5.16.js"></script>HTML部分<div class="container"><!--动态数据绑定--><my-info v-bind:data=msg v-on:close=closeHandler></my-info><!--静态数据绑定--><my-info ...
内容:普通函数,匿名函数,函数传递是如何让HTTP服务器工作的 ###普通函数 例子: function say(word) {console.log(word); } function execute(someFunction, value) {someFunction(value); } execute(say, "Hello"); ###匿名函数 function execute(someFunction, value) {someFunction(value); } execute(function(word){ console.log(word) }, "Hello");####################################################################...