Question

我已经设置了nuxt.js，转换了我的羽毛项目。到目前为止，它正在运作。通过邮递员添加的东西出现在我的浏览器的网页上。存在差异，即当我发布某些内容时，推送的整个数据阵列与初始数组不匹配。

样品

{ "message_txt": "Hello todays2" }
{ "id": 17, "message_txt": "Hello YESd", "updated_at": "2017-03-25T11:15:44.000Z", "created_at": "2017-03-25T11:15:44.000Z" }

所以第一行是如何配置数据被返回。这是在我的钩子文件中设置的：

'use strict';

const globalHooks = require('../../../hooks/index');
const hooks = require('feathers-hooks');


exports.before = {
    all: [],
    find: [
        getRelatedInfo()
    ],
    get: [
        getRelatedInfo()
    ],
    create: [],
    update: [],
    patch: [],
    remove: []
};

exports.after = {
    all: [],
    find: [],
    get: [],
    create: [
        getRelatedInfo()
    ],
    update: [],
    patch: [],
    remove: []
};

function getRelatedInfo() {
    return function (hook) {
        hook.params.sequelize = {
            attributes: [
                'message_txt'
            ],
            order: [
                ['created_at', 'DESC']
            ]
        };
        return Promise.resolve(hook);
    };
}

目前，我的客户端使用此部分加载数据：

<template>
    <div>
        idnex.vue

        <ul>
            <li v-for="message in messages">
                {{ message }}
            </li>
        </ul>
    </div>
</template>

<script>
    import axios from 'axios';
    import feathers from 'feathers/client';
    import socketio from 'feathers-socketio/client';
    import io from 'socket.io-client';

    export default {
        data: function() {
            return {
                messages: []
            }
        },
        mounted: function() {
            axios.get('http://localhost:3001/messages')
                .then((response) => {
                    this.messages = response.data.data
                });

            const app = feathers().configure(socketio(io('http://localhost:3001')));
            app.service('messages').on('created', (message) => {
                this.messages.push(message);
            })
        }
    }
</script>

问题我需要做什么来确保＆＃34; this.messages.push（消息）＆＃34;是相同的结构，所以只有＆＃34; message_txt＆＃34;。我尝试在创建＆＃34;之后将钩子中的函数添加到＆＃34;但它没有用。

解决

好的，因此更改客户端的组件文件可以访问服务，模型和挂钩以及客户端中配置的其他服务。＆＃39; service.find（）＆＃39;只是因为我从一个更复杂的服务中复制它，其中更多的列在find钩子中，我只想要特定的。

<template>
    <div>
        idnex.vue
        todo: eagle.js slideshow
        todo: first info

        <ul>
            <li v-for="message in listMessages">
                {{ message }}
            </li>
        </ul>
    </div>
</template>

<script>
    import feathers from 'feathers/client';
    import socketio from 'feathers-socketio/client';
    import hooks from 'feathers-hooks';
    import io from 'socket.io-client';
    import * as process from "../nuxt.config";

    const vttSocket = io(process.env.backendUrl);
    const vttFeathers = feathers()
        .configure(socketio(vttSocket))
        .configure(hooks());

    const serviceMessage = vttFeathers.service('messages');

    export default {
        layout: 'default',
        data: function() {
            return {
                listMessages: []
            }
        },
        mounted: function() {
            //TODO change the message layout to the correct layout
            serviceMessage.find({
                query: {
                    $sort: {
                        created_at: 1
                    },
                    $select: [
                        'message_txt'
                    ]
                }
            }).then(page => {
                this.listMessages = page.data;
            });
            serviceMessage.on('created', (serviceMessage) => {


                this.listMessages.push(serviceMessage);
            });
        }
    }
</script>

使用此代码，页面仍会加载，但是＆＃39; this.listMessages＆＃39;还要提供像created_at这样的东西。此外，当我没有nuxt和客户端/服务器情况（客户端和服务器是一个）时，我不需要创建＆＃39;显示的列表要实时更新。我仍然需要进行实时更新。

重要提示，我刚注意到在邮递员中你也看到了整个记录信息，而不是与GET相同的信息

几乎就在那里。我想出了我的钩子文件中要做什么

exports.after = {
    all: [],
    find: [],
    get: [],
    create: [
        hooks.remove('createdAt'),
        hooks.remove('updatedAt')
    ],
    update: [],
    patch: [],
    remove: []
};

在这个文件中我有上面的部分。如果我将删除中的列更改为自定义＆＃39;一个（在模型中）它将起作用。这两个人没有工作

Answer 1

this.messages.push（message.message_txt）; ？...

啊，我想我现在明白了你的意思。出于安全原因，只有params.query将在客户端和服务器之间传递。如果您想根据查询参数设置params.sequelize，您必须清理并将其映射到钩子中：

app.service('myservice').before(function(hook) {
  const query = hook.params.query;

  hook.params.sequelize = {};

  if(query.someSequelizeParameter) {
    hook.params.sequelize.myParameter = sanitize(query.someSequelizeParameter);
    delete query.someSequelizeParameter;
  }
});

其他选项只是使用Feathers钩子。此外，不是你的问题的一部分，但如果你正在使用套接字，你真的不需要Axios和通过方法更新REST的东西，你可以只是将服务绑定到套接字并使用类似RxJS的东西来流式传输所有实时更新。你正在做的事情很好并且可行，但需要维护更多的代码。

Feathers.js - ＆gt;更改after create hook的布局

1 个答案: