javascript - penyelesaian masalah mengikat parameter vuex
给我你的怀抱
给我你的怀抱 2017-06-28 09:27:40
0
1
747

Takrifan parameter dalam komponen adalah seperti berikut

<script>
import store from '../vuex/store';

export default {
    // vuex: {
    //     actions: actions,
    //     getters: {
    //         // 过滤后的会话列表
    //         sessions: ({ sessions, filterKey }) => {
    //             let result = sessions.filter(session => session.user.name.includes(filterKey));
    //             return result;
    //         },
    //         // 当前会话index
    //         currentId: ({ currentSessionId }) => currentSessionId
    //     }
    // },
    data(){
        return {
            sessions: store.state.sessions,
            currentId: store.state.currentSessionId
        }
    },
    methods:{
        selectSession(id){
            console.log(id);
            store.dispatch('selectSession', id)
        }
    }
};
</script>

<template>
<p class="list">
    <ul>
        <li v-for="item in sessions"  :class="{ active: item.id === currentId }" @click="selectSession(item.id)">
            <img class="avatar"  width="30" height="30" :alt="item.user.name" :src="item.user.img">
            <p class="name">{{item.user.name}}</p>
        </li>
    </ul>
</p>
</template>

Bolehkah takrif sesi terikat dua hala? Saya mendapati bahawa apabila kaedah selectSession dilaksanakan, sesi tidak berubah?

给我你的怀抱
给我你的怀抱

membalas semua(1)
伊谢尔伦

vuex 官方文档不是这么绑定数据的哦,数据监听放在 computed里面,而不是直接放在 data 的方法里面,而且 vuex Beginilah cara pemprosesan borang dua hala berfungsi.

//来自 vuex 官方例子

<input v-model="message">
// js
computed: {
  message: {
    get () {
      return this.$store.state.obj.message
    },
    set (value) {
      this.$store.commit('updateMessage', value)
    }
  }
}

Semoga ia membantu anda~~~

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!