Laravel 如何动态创建专用通道名称

Laravel 如何动态创建专用通道名称,laravel,vue.js,pusher,laravel-broadcast,Laravel,Vue.js,Pusher,Laravel Broadcast,我想使用laravel、vue和pusher创建实时订单跟踪系统。在管理面板中,我有所有订单的列表。其想法是,当管理员更改订单状态时,用户(此订单的所有者)将收到通知,而无需刷新页面。为了做到这一点,我想使用私人频道。我的问题是动态创建私有通道名称 管理面板如下所示 <h1>Admin</h1> <table> @foreach ($orders as $o) <tr> <td>{{$o->name

我想使用laravel、vue和pusher创建实时订单跟踪系统。在管理面板中,我有所有订单的列表。其想法是,当管理员更改订单状态时,用户(此订单的所有者)将收到通知,而无需刷新页面。为了做到这一点,我想使用私人频道。我的问题是动态创建私有通道名称

管理面板如下所示

<h1>Admin</h1>
<table>
    @foreach ($orders as $o)
    <tr>
        <td>{{$o->name}}</td>
        <td>{{$o->status}}</td>
        <td>{{$o->getUser->name}}</td>
        <td>
            <update-order-status :id="{{$o->id}}"></update-order-status>
        </td>
    </tr>
    @endforeach
</table>
Admin
@foreach($o订单)
{{$o->name}
{{$o->status}
{{$o->getUser->name}
@endforeach
更新订单状态组件,用于更改订单状态。订单Id通过道具传递给组件。组件的内容如下所示:

///update-order-status component
<template>
  <div>
    <form method="GET" action="change_status">
      <input type="hidden" name="id" :value=id />
      <select name="status">
              <option value="placed">Placed</option>
               <option value="progres">Progres</option>
               <option value="delivered">Delivered</option>
            </select>
      <input type="submit" value="update status" v-on:click="upd(id)" />
    </form>
  </div>
</template>

<script>
  export default {
    created() {
    },
    props: ["id"],

    data: function() {
      return {


      };
    },

    methods: {
      upd: function(id) {
        this.$root.$emit("eve", id);
      }
    }
  };
</script>
///更新订单状态组件
放置
进步
交付
导出默认值{
创建(){
},
道具:[“id”],
数据:函数(){
返回{
};
},
方法:{
upd:功能(id){
此.$root.$emit(“eve”,id);
}
}
};
当管理员提交表单订单状态在数据库中更新时,同时发出事件eve。此事件用于将订单id传递给状态已更改的组件。此组件放置在用户面板中,并包含订单状态已更改的通知

///status changed component

<template>
 <div  v-if="sn" class="notification is-primary">
  <button class="delete" v-on:click="del()"></button>
  Staus of order nr {{nr}} has been changed 
</div>
</template>

<script>
export default {
  created() {
    this.$root.$on("eve", data => {
      this.nr = data;
    });
    Echo.private("order" + this.nr).listen("status_changed", e => {
      this.sn = true;
    });
  },
  props: [],

  data: function() {
    return {
      sn: false,
      nr: 0
    };
  },
  methods: {
    del: function() {
      this.sn = false;
    }
  }
};
</script>
///状态已更改的组件
nr{{nr}}顺序的状态已更改
导出默认值{
创建(){
此.$root.$on(“eve”,数据=>{
this.nr=数据;
});
Echo.private(“订单”+this.nr)。监听(“状态改变”,e=>{
this.sn=真;
});
},
道具:[],
数据:函数(){
返回{
sn:错,
编号:0
};
},
方法:{
del:function(){
this.sn=假;
}
}
};

问题就在这里。变量nr始终为0。它不是动态变化的。当nr为静态或通道为公共时,此代码工作正常。请帮助。

回音
放在
$on
内。否则上的异步
$on发生得太晚,无法更改
Echo中的
nr

  created() {
    this.$root.$on("eve", data => {
      this.nr = data;
      Echo.private("order" + this.nr).listen("status_changed", e => {
        this.sn = true;
      });
    });
  }

是的,good one@Roy J。它有一个异步环境,因此代码的执行不能保证是顺序的。因此,通过将Echo实例放在
回调上的
$on中,它将检索您发出的
id
,@appson。