|
@@ -1,165 +0,0 @@
|
|
|
-import Vue from 'vue';
|
|
|
-//
|
|
|
-// /**
|
|
|
-// * 自定义指令
|
|
|
-// */
|
|
|
-Vue.directive('title2',function (el, binding, vcode) {
|
|
|
- el.title = el.innerText;
|
|
|
-})
|
|
|
-
|
|
|
-Vue.directive('title', {
|
|
|
- // 钩子函数,被绑定元素插入父节点时调用 (父节点存在即可调用,不必存在于 document 中)。
|
|
|
- inserted(el,binding,vcode){
|
|
|
- el.focus()
|
|
|
- el.title = el.innerText;
|
|
|
- // console.log( 'inserted',el,binding,vcode );
|
|
|
- },
|
|
|
- // 只调用一次,指令第一次绑定到元素时调用,用这个钩子函数可以定义一个在绑定时执行一次的初始化动作。
|
|
|
- bind(el,binding,vcode){
|
|
|
- // el.title = el.innerText;
|
|
|
- // console.log(el,binding,vcode);
|
|
|
- // console.log( 'bind',el,binding,vcode );
|
|
|
- },
|
|
|
- // 所在组件的 VNode 更新时调用,但是可能发生在其孩子的 VNode 更新之前。
|
|
|
- // 指令的值可能发生了改变也可能没有。但是你可以通过比较更新前后的值来忽略不必要的模板更新
|
|
|
- update(el,binding,vcode){
|
|
|
- // el.title = window.$(el).get(0).innerText;
|
|
|
- // console.log( 'update',window.$(el), el,binding,vcode );
|
|
|
- },
|
|
|
- // 所在组件的 VNode 及其孩子的 VNode 全部更新时调用。
|
|
|
- componentUpdated( el,binding,vcode ){
|
|
|
- el.title = el.innerText;
|
|
|
- // console.log( 'componentUpdated',el,binding,vcode );
|
|
|
- },
|
|
|
- // 只调用一次,指令与元素解绑时调用。
|
|
|
- unbind(){
|
|
|
- console.log( 'unbind' );
|
|
|
- }
|
|
|
-})
|
|
|
-
|
|
|
-/**
|
|
|
- * 当输入框获取到焦点时,
|
|
|
- * 为 show-focus 类 所在dom ,添加边框颜色类 el-focus
|
|
|
- * v-focus 指令必须和show-focus配合使用 否则无效
|
|
|
- */
|
|
|
-Vue.directive('focus',function (el, binding, vcode) {
|
|
|
- let mtinputList = el.querySelectorAll('input')
|
|
|
- if(!mtinputList){
|
|
|
- mtinputList = el.querySelectorAll('textarea')
|
|
|
- }
|
|
|
- let mtinput = null;
|
|
|
- if(!binding.value){
|
|
|
- mtinput = mtinputList[0]
|
|
|
-
|
|
|
- mtinput.onfocus = function () {
|
|
|
- let dom = window.$(el).parents('.show-focus');
|
|
|
- if(dom.length < 1){
|
|
|
- window.$(mtinput).addClass('el-focus')
|
|
|
- }else{
|
|
|
- dom.addClass('el-focus');
|
|
|
- }
|
|
|
- }
|
|
|
- mtinput.onblur = function () {
|
|
|
- let dom = window.$(el).parents('.show-focus');
|
|
|
- if(dom.length < 1){
|
|
|
- window.$(mtinput).removeClass('el-focus')
|
|
|
- }else{
|
|
|
- dom.removeClass('el-focus');
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- }else{
|
|
|
- for (let i=0; i < Number(binding.value) ; i++){
|
|
|
- mtinput = mtinputList[i]
|
|
|
- mtinput.onfocus = function () {
|
|
|
- let dom = window.$(el).parents('.show-focus');
|
|
|
- dom.addClass('el-focus');
|
|
|
- }
|
|
|
- mtinput.onblur = function () {
|
|
|
- let dom = window.$(el).parents('.show-focus');
|
|
|
- dom.removeClass('el-focus');
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
-})
|
|
|
-
|
|
|
-/**
|
|
|
- * 输入汉字为两个字符,英文为1个字符
|
|
|
- */
|
|
|
-Vue.directive('limitChineseMaxlength',{
|
|
|
- // 钩子函数,被绑定元素插入父节点时调用 (父节点存在即可调用,不必存在于 document 中)。
|
|
|
- inserted(el,binding,vcode){
|
|
|
- limitCharsFun(el,binding,vcode);
|
|
|
- },
|
|
|
- // 只调用一次,指令第一次绑定到元素时调用,用这个钩子函数可以定义一个在绑定时执行一次的初始化动作。
|
|
|
- bind(el,binding,vcode){
|
|
|
- limitCharsFun(el,binding,vcode);
|
|
|
- },
|
|
|
- // 所在组件的 VNode 更新时调用,但是可能发生在其孩子的 VNode 更新之前。
|
|
|
- // 指令的值可能发生了改变也可能没有。但是你可以通过比较更新前后的值来忽略不必要的模板更新
|
|
|
- update(el,binding,vcode){
|
|
|
- },
|
|
|
- // 所在组件的 VNode 及其孩子的 VNode 全部更新时调用。
|
|
|
- componentUpdated( el,binding,vcode ){
|
|
|
- limitCharsFun(el,binding,vcode);
|
|
|
- },
|
|
|
- // 只调用一次,指令与元素解绑时调用。
|
|
|
- unbind(){
|
|
|
- }
|
|
|
-})
|
|
|
-const limitCharsFun = function (el,binding,vcode){
|
|
|
- window.$(el).removeClass('is-exceed')
|
|
|
- let element = el.querySelector('.el-input__count-inner');
|
|
|
- let mtinputList = el.querySelectorAll('input')
|
|
|
- if(!mtinputList){
|
|
|
- mtinputList = el.querySelectorAll('textarea')
|
|
|
- }
|
|
|
- let mtinput = null;
|
|
|
- mtinput = mtinputList[0]
|
|
|
- let maxLength = vcode.data.attrs.maxlength;
|
|
|
- if (!maxLength){
|
|
|
- maxLength = 60;
|
|
|
- }
|
|
|
- mtinput.setAttribute('maxlength',maxLength*2)
|
|
|
- // mtinput.setAttribute("style","border-color:var(--themeColor9_5)")
|
|
|
- if (element){
|
|
|
- element.setAttribute('style',"color:#909399")
|
|
|
- }
|
|
|
- let inputValue = mtinput.value || vcode.data.model.value;
|
|
|
- if (common.wordLengthFilter(inputValue)> maxLength){
|
|
|
- if (common.byteLengthFilter(inputValue)>maxLength * 2){
|
|
|
- mtinput.value = common.subinput(inputValue,maxLength*2);
|
|
|
- }else{
|
|
|
- mtinput.value = common.subinput(inputValue,common.byteLengthFilter(inputValue));
|
|
|
- }
|
|
|
- mtinput.dispatchEvent(new Event("input"));//调用input事件使vue v-model绑定更新,下面相同
|
|
|
- }
|
|
|
- let innerText = inputValue;
|
|
|
- if (element){
|
|
|
- element.innerHTML = common.wordLengthFilter(innerText)+'/'+maxLength
|
|
|
- }
|
|
|
-
|
|
|
-};
|
|
|
-
|
|
|
-/**
|
|
|
- *图片高度根据宽高比例自适应
|
|
|
- */
|
|
|
-Vue.directive('proportion', {
|
|
|
- inserted: function (el, binding) {
|
|
|
- var w = el.offsetWidth;
|
|
|
- var h = w * binding.value;
|
|
|
- el.style.height = h + 'px';
|
|
|
- el.__resize = function () { update(el, binding); }
|
|
|
- window.addEventListener('resize', el.__resize);
|
|
|
- },
|
|
|
-
|
|
|
- componentUpdated: function (el, binding) {
|
|
|
- update(el, binding);
|
|
|
- },
|
|
|
-
|
|
|
- unbind: function (el) {
|
|
|
- window.removeEventListener('resize', el.__resize);
|
|
|
- }
|
|
|
-});
|
|
|
-
|