【问题标题】：Laravel echo vue js here methodLaravel echo vue js here方法
【发布时间】：2017-02-03 22:01:36
【问题描述】：

我这里的方法 vuejs，laravel echo 有问题。

广播频道

Broadcast::channel('task.*', function ($user, $taskId) {
    $task = Task::find($taskId);
    if ($task)
    {
        return ['id' => $user->id, 'name' => $user->name];
    }
});

刀片模板

<task-show inline-template :task="{{ json_encode($task) }}" :user-id="{{ auth()->user()->id }}" >
                        <ul>
                            <li v-for="viewer in viewersExceptMe">
                                @{{ viewer['name'] }}
                            </li>
                        </ul>
                        <div>
                            <table class="table table-bordered table-hover">
                                <tbody>
                                    <tr>
                                        <td>Task Name</td>
                                        <td>@{{  task['name'] }}</td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </task-show>

我的脚本

<script>
    export default{
        props : {
            task : Object,
            userId : Number
        },
        data : function () {
          return {
              viewers : []
          }
        },
        ready : function(){
            this.listen();
        },
        computed: {
            viewersExceptMe(){
                return _.reject(this.viewers, viewer => viewer.id == this.userId);
            }
        },
        methods : {
            listen(){
                Echo.join('task.' + this.task.id)
                    .here(viewers => {
                        this.viewers = viewers;
                    });
            }
        }
    }
</script>

在下图中，here 方法不起作用，当用户离开信息页面时，viewers 变量不会更新

【问题讨论】：

如果你在here()函数中console.log()他们，你看到观众了吗？
是的，只有第一次或刷新页面时

标签： vue.js laravel-5.3 broadcasting

【解决方案1】：

加入存在渠道

要加入在线状态频道，您可以使用 Echo 的加入方法。 join 方法将返回一个 PresenceChannel 实现，它与公开的 listen 方法一起，允许您订阅 here、join 和 leave 事件。

Echo.join(`chat.${roomId}`)
    .here((users) => {
        //
    })
    .joining((user) => {
        console.log(user.name);
    })
    .leaving((user) => {
        console.log(user.name);
    });

here 回调将在频道被立即执行后立即执行成功加入
joining 方法将在一个新的用户加入频道
离开方法将在用户执行时执行离开频道

在你目前的情况下，这个方法应该是这样的，

Echo.join('task.' + this.task.id)
                    .here(viewers => {
                            this.viewers = viewers;
                    })
                    .joining((user) => {
                        this.viewers.push(user)
                    })
                    .leaving((user) => {
                        this.viewers = _.reject(this.viewers, viewer => viewer.id == user.id);
                    });

参考：Laracast discuss，Laravel Documentation for broadcasting

【讨论】：