nf_view

功能描述

  1. nf_view是基于vue.js的一款组件，集成了请求数据、正在加载、无网络提示，利用vue的插槽（slot）不影响实际业务的情况下，快速的集成数据展示功能。

依赖的模块

快速使用

在header标签引入nf_view.css和nf_view.js

  1. <link rel="stylesheet" type="text/css" href="./nf_view.css" />
  2. <script type="text/javascript" src="./nf_view.js"></script>

在body中引入一下代码

  1. <nf-view ref="nf_view" debug="0" v-cloak>
  2.     //业务代码
  3. </nf-view>

在页面初始化函数中引入一下代码，在组件中封装了ajax方法

  1. this.$refs.nf_view.init({
  2.     top_refresh: true //可以下拉刷新
  3. });
  4. this.$refs.nf_view.ajax({
  5.     url: '',
  6.     method: 'get',
  7.     data: {
  9.     },
  10.     loading: true, //显示正在加载动画
  11.     token: false //是否在header中传token
  12. }, function(ret) {
  13.     self.personal_info = ret;
  14. });

特别说明

静态页面调试时，由于nf_view中的data_obj为空，页面不显示，调试需在nf-view增加debug=1 此组件为vue全局注册组件，页面中必须引入vue.js