Vue
温柔如風
相见即是缘
展开
-
ElementUi时间日期范围选择器DateTimePicker 限制范围
<el-date-picker class="condition" v-model="datePay" :picker-options="timeRange" type="daterange" value-format="yyyy-MM-dd" range-separator="至" start-placeholder="付款开始日期" end-placeholder="付款结束日期"></el-date-picker>主要是:picker-options="timeRang.原创 2021-12-25 15:50:48 · 1130 阅读 · 0 评论 -
Vue-Element ui的Dialog 与 wangEditor的初始化问题
我想在elementui的dialog弹出层里面用wangEditor。用setContent初始化数据发现报错。无法初始化经过排查发现是因为wangEditor进入页面时没有插入到dom里。所以将setContent方法放到opened方法里即可原创 2021-12-11 16:48:36 · 1013 阅读 · 3 评论 -
Elementui-sortableJs 排序
引入import Sortable from 'sortablejs'给好id row-key="id"mounted初始化mounted() { let that = this this.rowDrop(that) },排序修改方法rowDrop(that) { const tbody = document.querySelector('.el-table__body-wrapper tbody'); const _this = this;原创 2021-12-09 15:01:20 · 397 阅读 · 0 评论 -
Vue-自定义指令进行权限管理
vue 自定义指令进行权限控制原创 2021-12-04 15:52:40 · 1997 阅读 · 0 评论 -
Elementui-Table自定义行列边框颜色
<el-table class="MyCell" :header-cell-style="{borderColor:'black'}" :cell-style="{borderColor:'black'}" border :data="form" >.MyCell{ border: 1px solid black;}其实用这个就行了.el-table td, .el-table th.is-leaf,.el-table--border, .el-table--group{原创 2021-11-10 15:05:56 · 1726 阅读 · 0 评论 -
elementui级联选择器-中国省市区选择
级联选择器<div class="block"> <span class="demonstration">单选选择任意一级选项</span> <el-cascader :v-model="value" :options="data" :props="options" @change="show" clearable原创 2021-10-13 14:04:13 · 756 阅读 · 0 评论 -
js操作cookie
Cookie本质上是对字符串的操作,所以存放都使用字符串拼接。存的时候时间要求格林威治标准时间,所有toGMTString即可删除操作其实就是修改,将cookie的有效期设置为过期就可以了。//设置cookiesetCookie(key,value,time){ //30天 24小时 60分钟 60秒 毫秒为单位 //后台shiro没有设置rememberMe 所以重开浏览器会导致cookie失效 //传入key value 和以毫秒为单位的时间 var原创 2021-09-16 10:18:21 · 482 阅读 · 0 评论 -
Vue-打包
先了解一下node.js是什么Node.js是一个基于 Chrome V8 引擎的 JavaScript 运行时。工程中需要导入各种js框架,为了方便管理,需要npm包管理器,npm是node.js中的一部分。安装好node即可使用。什么是webpack及作用?打包所有的资源,使浏览器都能正常识别文件。Vue-loader作用vue-loader 是 webpack 的一个 loader,用于处理 .vue 文件。可以将vue文件转换为JS模块。搭建vue工程步骤安装node.js原创 2021-03-22 12:59:25 · 370 阅读 · 0 评论 -
Vue-路由
<html> <head> <meta charset="utf-8"> <!--1. 引入router插件--> <script src="js/vue.js"></script> <script src="js/vue-router.js"></script> <title>vue中的路由</title> </head> <body>原创 2021-03-19 12:43:33 · 70 阅读 · 0 评论 -
Vue-父子组件传值
使用prop方式:单向传递定义一个父子组件 // 全局组件 Vue.component("my-parent",{ // 父组件名称 data(){ return{ msg:'' } }, template:"#parent", components:{ "my-child":{ // 子组件名称 props:['title'], data(){ return{ childtext:'这是原创 2021-03-18 13:09:02 · 94 阅读 · 0 评论 -
Vue-组件
组件 (Component) 是 Vue.js 最强大的功能之一。组件可以扩展 HTML 元素,封装可重用的代码。在较高层面上,组件是自定义元素,Vue.js 的编译器为它添加特殊功能。所有的 Vue 组件同时也都是 Vue 的实例,所以可接受相同的选项对象 (除了一些根级特有的选项) 并提供相同的生命周期钩子。全局组件示例<div id="app"> <!-- 常规标签 --> <button @click="show($event)">你点击了{{c原创 2021-03-17 12:52:03 · 57 阅读 · 0 评论 -
Vue-自定义指令实现页面div拖拽功能
<html> <head> <meta charset="utf-8"> <title></title> <script src="js/vue.js"></script> </head> <body> <!-- 为了可移动,position属性设置成绝对定位 --> <div class="box" v-drag="greet" style="width:转载 2021-03-15 13:05:34 · 738 阅读 · 0 评论 -
Vue-异步请求
什么是异步请求(AJAX)?异步是(Asnychronous Javascript and XML)的简称,表示一个线程在发起一个请求后,在空闲等待的时间里去执行其它的任务,请求完成后通知线程再次进行后续结果的处理。同步是一个线程必须要等待上一次请求完成后再执行后续的操作。异步请求的哪些方式?原生js方式创建XMLHttpRequest对象jQueryAxiosFetch什么是Axios及特点?中文官网:http://www.axios-js.com/zh-cn/docs/axios原创 2021-03-15 13:01:30 · 2671 阅读 · 0 评论 -
Vue-自定义指令
什么是指令指令是一个特殊 attribute,用于操作DOM对象.常见的指令:v-if v-else if v-else v-for v-show v-model v-on v-bind v-text v-html v-once v-pre v-clock为什么需要自定义指令vue自带的指令不能满足业务需要,比如说更换元素样式,或者权限管理等。自定义指令的开发步骤全局指令// 全局指令写在vue的实例创建前(简写方式)Vue.directive("red",function(el原创 2021-03-12 12:46:53 · 129 阅读 · 0 评论 -
Vue-生命周期
什么是vue的生命周期每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如,需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。beforeCreate():created(): 实例创建完成(用于页面异步加载数据).beforeMonut():mounted():实例挂载DOM完成(用于页面异步加载数据)beforeUpdate():updated():实例更新数据完成beforeDestroy():destro原创 2021-03-10 21:27:41 · 69 阅读 · 0 评论 -
Vue-v-if及switch的使用
首先讲下v-for<meta charset="utf-8"> <!--1.引入vue.js--> <script src="js/vue.js"></script> <title> vue的实例</title> </head> <body> <!--2. 指定一个div层,用于绑定vue实例--> <div id="app"> <!--v-pre:不原创 2021-03-09 14:36:42 · 4409 阅读 · 0 评论 -
Vue-初识vue
前端常用的主流框架有哪些?Angular: 2009年 Google 71.2KReact: 2013年 Facebook 165kVue: 2014年 尤雨溪 180kVue简介Vue.js是一个渐进式的(可以使用一部分特性),可逐步采用的JavaScript框架,用于在Web上构建UI,支持数据双向绑定我所理解的渐进式框架就是:不用掌握它所有的语法规则也能进行开发官网: https://cn.vuejs.org/特点简单、易用,上手快(HTML+CSS+JS)灵活(完整原创 2021-03-08 13:53:46 · 185 阅读 · 0 评论