页面权限控制 页面权限控制是什么意思呢？ 就是一个网站有不同的角色，比如管理员和普通用户，要求不同的角色能访问的页面是不一样的。如果一个页面，有角色越权访问，这时就得做出限制了。 Vue 动态添加路由及生成菜单 这是我写过的一篇文章， 通过动态添加路由和菜单来做控制，不能访问的页面不添加到路由表里，这是其中一种办法。 另一种办法就是所有的页面都在路由表里，只是在访问的时候要判断一下角色权限。如果有权限就让访...
一、前言 vuejs中的事件绑定，使用<v-on:事件名 = 函数名>来完成的，这里函数名是定义在Vue实例中的methods对象中的，Vue实例可以直接访问其中的方法。 二、事件绑定方式 1、 直接在标签中写js方法 <button v-on:click="alert（'hi'）">执行方法的第一种写法</button> 2、调用method的办法 <button v-on:click="run()">执行方法的第一种写法</button><button @click="run()">执行方法的 简写 写法</button> export default { d...
前言 在深入了解Vue动态创建Component前先了解一下常规组件声明形式。Vue 的组件通常可以通过两种方式来声明，一种是通过 Vue.component，另外一种则是 Single File Components（SFC） 单文件组件 。常规组件声明与注册// 定义一个名为 button-counter 全局注册的组件 Vue.component("button-counter", {template: <button v-on:click="count++">You clicked me {{ count }} times.</button>,data() {return {count: 0}} });new Vu...
jquery里面有个each方法，将循环操作简化、便捷。 随后es出了个forEach方法，两个虽然用法相近，但是不能处理对象类型。且无法通过return true达到continue效果。 此外还有个every方法，该方法虽然可以实现continue效果，但是在处理类数组与对象类型时，完全无用。 在不使用 jquery 的 each 方法时，该如何处理；或者说用原生如何来实现？ 前些前写了个类库: jTool , 其中就实现了该方法。 简单实现: // 通过字面量方式实现的函数e...
随着组件的细化，就会遇到多组件状态共享的情况， Vuex当然可以解决这类问题，不过就像 Vuex官方文档所说的，如果应用不够大，为避免代码繁琐冗余，最好不要使用它，今天我们介绍的是 vue.js 2.6 新增加的 Observable API ，通过使用这个 api 我们可以应对一些简单的跨组件数据状态共享的情况。 先看下官网描述，如下图 observable()方法，用于设置监控属性，这样就可以监控viewModule中的属性值的变化，从而就可以动态的改变某个...
由于 Laravel-admin 采用的是 pjax 的方式刷新页面，意味着很多页面刷新的操作，并不是刷新整个 document，而是从服务器拿到部分 document，再通过类似 $(“#pjax-container”).html(newPart) 的方式更新的。 这就造成一个问题，每次 pjax 刷新，都会破坏 vue 的 dom 映射。 所以理论上有2种方法解决： 重新绑定一下 vue 的映射关系 在某些页面禁止 pjax 1 太难搞，而且没啥资料，放弃。2 的话比较可行。 部分禁止 pjax 打开 publi...
录音功能一般来说在移动端比较常见，但是在pc端也要实现按住说话的功能呢？项目需求：按住说话，时长不超过60秒，生成语音文件并上传，我这里用的是recorder.js 1.项目中新建一个recorder.js文件，内容如下，也可在百度上直接搜一个 // 兼容 window.URL = window.URL || window.webkitURL navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserM...
过滤器 1.过滤器规则 Vue.js 允许你自定义过滤器，可被用于一些常见的文本格式化。过滤器可以用在两个地方： 双花括号插值{{}}和 v-bind 表达式 (后者从 2.1.0+ 开始支持)。过滤器应该被添加在 JavaScript 表达式的尾部，由“管道”符号指示： <!-- 在双花括号中 --> {{ name | Upper }} <!-- 在 `v-bind` 中 --> <div v-bind:id="martin | Upper"></div>过滤器分为全局过滤器和本地过滤器,全局过滤器顾名思义就是所有Vue实例挂载...
在vue1.x版本里是自带里几个基础的过滤器的（虽然不怎么用到）。 到了vue2.x版本之后，内置到几个过滤器就被删掉了，如果需要用到过滤器，就要开发者自己去定义。 可以把过滤器定义在某个组件内部，但这样就成了局部过滤器，在别的组件里是无法使用的。所以通常不会这么做。 也可以把过滤器写在main.js里。但如果项目中存在多个过滤器，这会使main.js文件看上去很庞大，不便于后期维护。 所以通常会新建一个js文件，专门用来存放所...
1.连接蓝牙 （第一次发表博客） 第一步打开蓝牙并搜索附近打印机设备// startSearch: function() { var that = this wx.openBluetoothAdapter({ success: function(res) { wx.getBluetoothAdapterState({ success: function(res) { if (res.available) { if (res.discovering) { wx.stopBluetoothDevicesDiscovery({ success: function(res) { console.log(res) } }) } that.checkPemission() } else { wx.showModal({ title: 提示...
滚动固定位置有多种方法 1 css3 粘性定位 position:sticky； top:20px；2直接position：fixed；给顶部盒子设置一个margin-top刚好是需要固定的盒子的高度 3事件监听更改style中的position属性 ** 修改样式 滚动监听事件中使用this.$refs.xxx.style.color=‘xxxx' 这种方式会报错 Uncaught TypeError: Cannot read property 'style' of undefined 所以通过动态绑定来解决。 具体： ** html绑定<p class="ptop1" :style="pstyle"><i...
写本篇文章之前其实也关注过vue中的一个关于加载动态组件is的API，最开始研究它只是用来实现一个tab切换的功能，使用起来也蛮不错的。 is 预期：string | Object (组件的选项对象) 用于动态组件且基于 DOM 内模板的限制来工作。 示例： <!-- 当 `currentView` 改变时，组件也跟着改变 --> <component v-bind:is="currentView"></component> 详见vue API中关于is的定义和用法 至于用在tab切换中，大概就是： <template><div><div>#动...
config/config.default.js exports.io = {init: {},namespace: {/: { //对应router.js里的 of(/)connectionMiddleware: [ auth ], //对应io/middleware/authpacketMiddleware: [ filter ],},},}; config/plugin.js exports.io = {enable: true,package: egg-socket.io, }; router.jsio.of(/).route(chat, io.controller.chat.index);io.of(/).route(message, io.controller.chat.message);io.of(/).route(user:online, io.control...
本文实例为大家分享了Vue实现表格批量审核功能的具体代码，供大家参考，具体内容如下 1 前端部分 效果如下图所示：1.1 html部分<el-form-item><el-button type="success" icon="el-icon-search" @click="auditServer()" :disabled="this.sels.length === 0">批量审核</el-button><el-button @click="toggleSelection()">取消选择</el-button></el-form-item></br><el-table border :fit="true" ref="multipleTable" height="520" :...
在web中，我们动态添加DOM，可以用jQuery的方法，很简单。在微信小程序中怎么实现下面这么需求。其中，里程数代表上一行到这一行地方的距离（这个不重要）；要实现的就是点击增加途径地，就多一行，删除途径地，就少一行。 分析：添加的和删除的是同样的结构，只是数量不一样，所以考虑循环，用列表表示，增加就往这个列表push一个，删除就从列表pop一个。主要代码如下： <view class="weui-cell weui-cell_input"><view class="we...