四、MOCK數(shù)據(jù)設(shè)計

通過需求分析得到只需要兩份基礎(chǔ)數(shù)據(jù)：

• 聯(lián)系人數(shù)據(jù)
• 初始聊天記錄數(shù)據(jù)

其對應(yīng)的數(shù)據(jù)表結(jié)構(gòu)如下：

因此我們可以使用js構(gòu)建這兩份數(shù)據(jù)表作為原始數(shù)據(jù)，目錄結(jié)構(gòu)設(shè)計大致如下：

src
    mocks  --- mock數(shù)據(jù)目錄
        users  --- 用戶頭像目錄
            xxxx.png  --- xxxx頭像
        contact.js  --- 聯(lián)系人mock數(shù)據(jù)
        history.js  --- 聊天記錄mock數(shù)據(jù)

src/mock/contact.js 模擬聯(lián)系人數(shù)據(jù)返回，代碼如下：

// 所有聯(lián)系人數(shù)據(jù)
let users = [
    {id: 'jimgreen', name: 'Jim Green'},
    {id: 'hanmeimei', name: '韓梅梅'}
];
users = users.sort((a, b) => a.id.charCodeAt(0) - b.id.charCodeAt(0));

let table = users.map((v) => {
    return {
        name: v.name,
        id: v.id,
        icon: `/mocks/users/${v.id}.png`
    };
});
export default table

src/mock/history.js模擬初始聊天記錄數(shù)據(jù)返回，代碼如下 ：

export default [
    {'to': 'jimgrenn', 'from': 'me', 'type': 'text', 'msg': 'My name is Jim Green, nice to meet you.', 'time': 1480338091374},
    {'to': 'me', 'from': 'jimgreen', 'type': 'text', 'msg': 'Nice to meet you too', 'time': 1480338091375},
];