精华内容
下载资源
问答
  • api/index.js //对象 var myobj = { 'id': 1, 'fun': function() { return "fun"; }, 'name': 'myObj', 'fun1': function() { return "fun1"; } } //函数 function abc(){ return "abc"; } fu.
    api/index.js
    //对象
    var myobj =
        {
            'id': 1,
            'fun': function() {
                return "fun";
            },
            'name': 'myObj',
            'fun1': function() {
               return "fun1";
            }
    		}
    
    //函数	 
    function abc(){
    	return "abc";
    }
    function abc2(){
    	return "abc2";
    	}
    
    function ab3(){
    	return "ab3";
    	}
    
    
    export {abc,abc2,ab3,myobj}

     

    //main.js
    
    import {abc,abc2,ab3,myobj} from './api/index'
    Vue.prototype.$api={"abc":abc,"abc2":abc2,'myobj':myobj};
    //index.vue使用
    
    	console.log(this.$api.myobj.fun());
    	console.log(this.$api.myobj.name);
        console.log(this.$api.abc2());
    

     

    展开全文
  • export default 封装函数

    2020-03-15 14:56:08
    //模块化 封装一个请求函数 //exportexport default均可用于导出常量、函数、文件、模块等 export default ({ url, data }) => { //返回 return new Promise((resolve, reject) => { wx.r...

    export default 就是把这个文件的函数等,可以拿到其他地方用.

    //模块化 封装一个请求函数
    //export与export default均可用于导出常量、函数、文件、模块等
    export default ({
      url,
      data
    }) => {
    	//返回
      return new Promise((resolve, reject) => {
        wx.request({
          url, //就等于上面传进来的
          data, //跟上面一样
          header: {
            'X-Client-Info': '{"a":"3000","ch":"1002","v":"5.0.4","e":"1584246922725849474186","bc":"440100"}',
            'X-Host': ' mall.film-ticket.film.list'
          },
          //成功发送出去
          success: res => {
            resolve(res)
          },
          //请求失败也发出去
          fail: err => {
            reject(err)
          },
        })
      })
    }
    
    //调用
    import get from "get.js"
    get({
      url: "xxx",
      data: {
    
      }
    }).then(res=>{
      //传出成功的对象
      console.log(res)
    })
    
    
    展开全文
  • 简单的promise封装 封装promise时首先我们需要了解promise是什么? 1、主要用于异步计算。 2、可以将异步操作队列化,按照期望的顺序执行,返回符合预期的结果。 3、可以在对象之间传递和操作promise,帮助我们处理...

    简单的promise封装

    封装promise时首先我们需要了解promise是什么?

    1、主要用于异步计算。
    2、可以将异步操作队列化,按照期望的顺序执行,返回符合预期的结果。
    3、可以在对象之间传递和操作promise,帮助我们处理队列。

    promise 封装
    const promise = new Promise(function(resolve, reject) {
      if (/* 异步操作成功 */){
        resolve(value)
      } else {
        reject(error)
      }
    })
    

    这样可以实现简单的promise封装,其中resole()为成功是的回调而reject()为失败时的回调。

    promise封装AJAX

    首先我们需要知道什么是ajax?

    AJAX = 异步 JavaScript 和 XML。

    AJAX 是一种用于创建快速动态网页的技术。

    通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。

    JQ AJAX封装

    jquery其实已经对ajax进行了一次封装代码如下:

    $.ajax({
    url:"服务器",//地址
    data:{"key":所传数据},//传输的数据(键值对方式)
    type:"post",//传输的类型
    dataType:"json",//数据格式
    success:function(aaa){
    //aaa为服务器所返回的值
    },
    error:function(){
    //服务器连接失败
    },
    beforeSend:function(){//在success之前就进行了
    //操作
    },
    complete:function(){//在success之后就进行
    //操作
    }
    });
    

    了解了AJAX的封装,我们接下来用promise对AJAX进行简单的封装。

    index.js

    export const New_promise = (param) => {
        return new Promise((resolve, reject)=>{
           $.ajax({
               ...param,
               success: function (res) {
                   //请求成功时处理
                   resolve(res)
                },
               error: function (err) {
                   //请求出错处理
                   reject(err)
               }
           });
        })
     }
    

    这边我们利用ES6解构赋值的方法来对param进行结构,如果不了解什么是结构复制可以去看下ES6教程
    使用 在index.html页面中代码如下:

    index.html

     <script type="module">
            import {New_promise } from './js/index.js'; 
            New_promise({url:'在此处放入请求的地址'}).then(result=>{console.log(result);}
     </script>
    

    这里我们呢默认是get请求。

    接下来我们需要了解的是export 以及 export default 的区别

    export 可以是多个 而export default 是一个。

    我们来看一下:

     import {a} from './js/index.js';
     import New_promise from './js/index.js';
    
    export {a}
    export default New_promise
    
    展开全文
  • // 过滤输入的特殊字符,export是将方法暴露 export function stripscript(str) { var pattern = new RegExp("[`~!@#$^&*()=|{}':;',\\[\\].<>/?~!@#¥……&*()&;—|{}【】‘;:”“'。,、...
    // 过滤输入的特殊字符,export是将方法暴露
    export function stripscript(str) {
        var pattern = new RegExp("[`~!@#$^&*()=|{}':;',\\[\\].<>/?~!@#¥……&*()&;—|{ }【】‘;:”“'。,、?]")
        var rs = "";
        for (var i = 0; i < str.length; i++) {
                rs = rs + str.substr(i, 1).replace(pattern, '');
            }
        return rs;
    }
        
    

    主页面引用:import {stripscript,aa} from “@/utils/validate”; 意思是引用哪个几个方法来自哪个文件,其中@是在vue.config.js中配置的路径别名

     configureWebpack: config => {
        config.resolve = { // 配置解析别名
          extensions: ['.js', '.json', '.vue'],//自动添加文件名后缀
          alias: {
            '@': path.resolve(__dirname, './src'),
            'public': path.resolve(__dirname, './public'),
            '@c': path.resolve(__dirname, './src/components'),
            'common': path.resolve(__dirname, './src/common'),
            'api': path.resolve(__dirname, './src/api'),
            'views': path.resolve(__dirname, './src/views'),
            'data': path.resolve(__dirname, './src/data')
          }
        }
      },
    
    展开全文
  • 实际开发中,经常会将js逻辑封装成独立的js文件,而采用export导出需要被使用的变量或函数。 而在调用时,通过import来导入我们封装的逻辑内容,即import 呼应 exportjs提供了 exportexport default 两个...
  • tableExport.js导出execl-增加表头

    千次阅读 热门讨论 2018-11-16 15:33:00
    导出execl表格增加表头,本篇文章是在上一篇《tableExport.js导出execl-数字格式化方案》的基础之上进行,tableExport.js导出execl的方式和使用方法不做赘述,上篇解决问题为数据格式化,本篇是增加execl表头 ...
  • vue封装js和引入外部js文件 现在src目录下新建uitlmap.js文件
  • Export2Excel.js

    2019-10-14 17:56:30
    封装导出表格js文件!
  • vue 全局封装js方法

    千次阅读 2018-11-28 11:31:16
    1.利用install方法 挂在在Vue实例下的 雷同 之前写得全局组件封装一致   // util.js export.install = (Vue,option)=&gt;{ Vue.protoType.format = (data) =&gt;{ //数据处理 就不用写了吧 } } ...
  • vue js 工具方法封装js 文件

    千次阅读 2019-01-02 09:43:55
    首先写一个js 文件 export defalt **api const envYml = { /** * 创建配置 yml configMap 操作 */ test: () =&gt; { console.log("test"); }, } export default envYml 在要引入的页面&...
  • 插件封装了将数据集呈现为excel或csv的功能。 安装 余烬安装ember-cli-data-export 用法 使用js-xlsx库呈现excel内容。 自动为excel和csv格式注入服务 提供一个数据结构,该数据结构是一个数组数组,其中每个内部...
  • VUE封装js方法

    2020-06-28 08:45:21
    } } export default { toRouter, dele }; 外部引用 import perm from "../../../components/Hidden/permission"; //引入按钮公共方法 [item.button_func](item.homeuri)" v-for="(item,index) in topbtn" :key=...
  • Vue 封装js 并 引用

    千次阅读 2018-06-14 11:40:00
    /封装模块化文件 新建的.js文件 var storage = { set(key, value) { localStorage.setItem(key, JSON.stringify(value)); }, get(key) { return JSON.parse(localStorage.getItem(key)); }, remove(key) ...
  • javascript请求封装

    2020-02-17 10:54:43
    很多人在写前端代码的时候,都不做请求封装,这样容易出现的情况是,假设在一个项目中,有100个页面,每个页面都需要向服务器发送请求,来完成数据的交互,突然有一天,产品的哥们说,咱们得加个请求的验证,给请求...
  • 通常我们可以用下面这种方法进行一个封装,这样在外部引入我们写的这个js文件后,就可以直接使用export.getUserId()这种形式去调用该函数 (function($, owner) { /* * 中间就可以进行封装操作 * $就代表mui...
  • 封装一些经常使用的方法 例子 const mylib = {} mylib.Array = (function() { // 私有变量 // eslint-disable-next-line no-unused-vars const _version = '1.0.0.0' // 私有函数 var _getVersion = function...
  • vue.js封装组件

    千次阅读 2019-04-16 15:39:26
    vue.js封装组件 1.放在main.js全局注册 import components from "./components" //路径 Object.keys(components).forEach(k=>Vue.component(k,components[k])); 2.需要在./components路径下写一个index.js ...
  • JavaScript 模块封装

    2020-08-07 17:37:50
    在最早的时候JavaScript这门语言其实是... 以下有两个Js文件,如果不采取任何封装手段直接导入会导致window环境污染。 并且,如果文件中有相同名字的变量或函数会发生命名冲突,因为它们都是放在全局作用域window对象
  • JS 封装LocalStorage

    2021-09-02 11:24:01
    export function setItemToLocal (key, val) { let storageContent = JSON.parse(localStorage.getItem(namespace)) || {} storageContent[key] = val; localStorage.setItem(namespace,JSON.stringify...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 46,420
精华内容 18,568
关键字:

export封装js