防止反复定义一样的内容，把效劳协定抽离成配置文件

2019年9月1日 225次阅读 来源: totora_MS

作者： totoro_MS

需求背景

这周有一个需求，须要在差别的页面增加平台效劳协定，协定现在有2个，今后能够会有更多协定。增加协定的位置是在‘我的->关于’和‘开户首页的弹窗’。在‘开户首页的弹窗’这个处所会比较贫苦，由于这里弹窗展现的券商的协定，我要新增平台的效劳协定进来。

处理方法

考虑到要在差别的页面展现协定，在差别页面展现的情势不一样，所以没做成组件的情势。然则又不想在每一个页面都定义协定的题目和协定跳转的url。所以我的处理方法是，把协定内容抽离成配置文件。以下

protocols.json
{
    "SERVICE_PROTOCOL": {
        id: 'USER_SERVICE',
        title: '用户效劳协定',
        url: 'https://xxxxx',
    },
    "PRIVATE_PROTOCOL": {
        id: 'PRIV',
        title: '用户隐私协定',
        url: 'https://xxxxx',
    }
}

使用方法：在须要展现需求的页面内里把配置文件import进来

About.vue
<script>
import PROTOCLS from  'protocols.json';
PROTOCOLS.SERVICE_PROTOCOL.id如许就可以访问到协定的内容
</script>

长处

  1. 通过把协定的内容抽离成配置文件，如许我就避免了在差别的页面都定义这些协定的相干属性。DON’T REPEAT YOUR CODE
  2. 保护两个处所的定义比保护一个json文件有风险，就怕修正的时刻修正漏了，致使上线展现不一致。

在开户首页的弹窗怎样追加我的新协定内容

弹窗的内容是从另一个配置文件读出来的，针对差别的券商展现差别的协定内容。我的处理方法是，是在读取配置文件的时刻做一个处置惩罚，把从protocols.json读出来后，把数据push(data)到一个新对象，如许构成一个新的对象，末了在页面上衬着出来就好。题目就如许处理。

总结

DON’T REPEAT YOUR CODE。当代码反复的时刻，就想一下怎样把反复的内容抽离出来。

《防止反复定义一样的内容，把效劳协定抽离成配置文件》

    原文作者：totora_MS
    原文地址: https://segmentfault.com/a/1190000019299426
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞