Postman说明Postman是一种网页调试与发送网页http请求的chrome插件。我们可以用来很方便的模拟get或者post或者其他方式的请求来调试接口。 Postman背景介绍 用户在开发或者调试网络程序或者是网页B/S模式的程序的时候是需要一些方法来跟踪网页请求的，用户可以使用一些网络的监视工具比如著名的Firebug等网页调试工具。今天给大家介绍的这款网页调试工具不仅可以调试简单的css、html、脚本等简单的网页基本信息，它还可以发送几乎所...
v-module 双向绑定实际上就是通过子组件中的 $emit 方法派发 input 事件，父组件监听 input 事件中传递的 value 值，并存储在父组件 data 中；然后父组件再通过 prop 的形式传递给子组件 value 值，再子组件中绑定 input 的 value 属性即可。 我们着手实现一遍： 子组件传值 首先子组件需要一个 input 标签，这个 input 标签需要绑定 input 事件，$emit 触发父组件的 input 事件，通过这种方法子组件传递值给父组件 <input type="t...
小白我用的是vue-cli的全家桶,在标签中加入v-drap则实现元素拖拽， 全局指令我是写在main.js中 Vue.directive(drag, {inserted: function (el) {el.onmousedown=function(ev){var disX=ev.clientX-el.offsetLeft;var disY=ev.clientY-el.offsetTop;document.onmousemove=function(ev){var l=ev.clientX-disX;var t=ev.clientY-disY;el.style.left=l+px;el.style.top=t+px;};document.onmouseup=function(){document.onmousemove=nu...
render-header render-header在官方文档中的介绍是这样的：参数说明类型可选值默认值render-header列标题 Label 区域渲染使用的 FunctionFunction(h, { column, $index })—— 修改列标题样式 1.在列标题后面加一个图标。 以element-ui官方文档一个table表格为例，我们在地址的后面加一个定位标志的图标，代码如下： <template><el-table:data="tableData2"style="width: 100%":row-class-name="tableRowClassName"><el-table-colu...
前言在指令里获取的this并不是vue对象，vnode.context才是vue对象，一般来说，指令最好不要访问vue上的data，以追求解耦，但是可以通过指令传进来的值去访问method或ref之类的。 vue指令官方文档其实已经解释的蛮清楚了，这里挑几个重点的来讲。 1、arguments el: 当前的node对象，用于操作dom binding：模版解析之后的值 vNode: Vue 编译生成的虚拟节点,可以在上面获取vue对象 oldVnode: 使用当前指令上一次变化的node内容 2、 生...
先上效果图：（1） 看起来可能有点卡顿，但是实际上页面上看起来挺顺畅的。 （2） 思路就是获取每一个列表的宽度，设置定时器移动列表，当移动的距离达到一个列表的宽度的时候，把这个距离放到数组的最后。这样就能达成无缝循环滚动了。 大致的情况就是下面这样： 接下来就是代码的实现： index.vue 引入组件 <template><div><marqueeLeft :send-val=send></marqueeLeft ></div> </template> <script>import marqueeLeft from ....
背景在做快狗打车小程序时，关于默认导航栏，我们遇到了以下的问题： Android、IOS手机对于页面title的展示不一致，安卓title的显示不居中页面的title只支持纯文本级别的样式控制，不能够做更丰富的title效果左上角的事件无法监听、定制路由导航单一，只能够返回上一页，深层级页面的返回不够友好我们希望的是：在各个机型页面上title一致性 & 个性化展示、取得左上角点击事件控制权及深层级页面的一键返回实现step1 自定义第一步 ...
Vue中内置了很多的指令，如v-model、v-show、v-html等，但是有时候这些指令并不能满足我们，或者说我们想为元素附加一些特别的功能，这时候，我们就需要用到vue中一个很强大的功能了—自定义指令。 在开始之前，我们需要明确一点，自定义指令解决的问题或者说使用场景是对普通 DOM 元素进行底层操作，所以我们不能盲目的胡乱的使用自定义指令。 如何声明自定义指令？ 就像vue中有全局组件和局部组件一样，他也分全局自定义指令和局...
1、发现问题 小程序页面自定义导航栏功能已经开放有些日子了(还不知道这个功能的可以先>>了解一下)，这极大的提升了小程序开发的自由度，相信不少小伙伴已经使用过这个功能，同时也相信不少小伙伴在此功能开发过程中踩过同样的一些坑： 机型多如牛毛：自定义导航栏高度在不同机型始终无法达到视觉上的统一；调皮的胶囊按钮：导航栏元素（文字，图标等）怎么也对不齐那该死的胶囊按钮；各种尺寸的全面屏，奇怪的刘海屏，简直要抓狂。...
最近开发一个项目时，有微信H5网页自定义分享功能，使用了微信JS-SDK的分享到好友和分享到朋友圈功能。 微信开发文档这样写的 自定义“分享给朋友”及“分享到QQ”按钮的分享内容（1.4.0）wx.ready(function () { //需在用户可能点击分享按钮前就先调用 wx.updateAppMessageShareData({ title: , // 分享标题 desc: , // 分享描述 link: , // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致 imgUrl: , // 分...
一、什么是全局API？ 全局API并不在构造器里，而是先声明全局变量或者直接在Vue上定义一些新功能，Vue内置了一些全局API，比如我们今天要学习的指令Vue.directive。说的简单些就是，在构造器外部用Vue提供给我们的API函数来定义新的功能。 二、Vue.directive自定义指令 我们在第一季就学习了内部指令，我们也可以定义一些属于自己的指令，比如我们要定义一个v-jspang的指令，作用就是让文字变成绿色。 在自定义指令前我们写一个小功...
本文介绍了vue v-model进行数据绑定，分享给大家，具体如下 官方例子https://vuefe.cn/v2/api/#model 有这么一句话： 默认情况下，一个组件上的 v-model 会把 value 用作 prop 且把 input 用作 event。 示例： 先来一个组件，不用vue-model，正常父子通信<!-- parent --><template><p class="parent"><p>我是父亲, 对儿子说： {{sthGiveChild}}</p><Child @returnBack="turnBack" :give="sthGiveChild"></Child></p></template><sc...
实现如例子所示的可视化可拖放表单功能。整个页面，分为左中右三栏布局，左栏的部件库的部件（组件）作为key,拖放到中间区域时，往vuex存放数组数据，拖一个就push一个。点击某个组件时，在右栏显示其属性，其实也就是在vuex存放的数据中查找数据迭代属性。 左中右三栏 左右固定 中间自适应布局首先，布局上来看，左右都是可以拉伸的，中间是自适应的布局。 左右分别float left和float right, 中间栏使用margin撑开布局，即可完成布...
微信二次分享／自定义分享 从App中使用App分享（一次分享）使用微信导航栏的分享（二次分享） －－已做处理使用微信导航栏的分享（二次分享） －－未做处理如上图，如果不做相关处理，页面进行二次分享，用户看到的就是链接＋空图，上面显示的文案（考拉阅读）实际上是获取的title标签中的文案，我在网上查的相关例子有说明，图片如果不设置，将会自动获取浏览器渲染的第一张图片，经过个人测试，并没有实现（朋友圈同理，不做图片...
element-ui默认的table组件支持的表头筛选（过滤）是比较简单的，只支持数组的方式，单选或多选的形式，但有时候我们喜欢支持输入框形式（其实感觉有点扯淡，一般列表页上面都有搜索条件）。 注意：里面用到的jsx语法，可能需要安装一些插件。 准备工作：1.安装babel-plugin-jsx-v-model插件 npm i babel-plugin-jsx-v-model -D或者 yarn add babel-plugin-jsx-v-model -D2..babelrc: {"presets": ["es2015"],"plugins": ["jsx-v-m...