翻页后点击详细页，返回时失效

ALEXFUNGZH commented 7 years ago

假如列表存在翻页，进入详细页返回时，列表只有第一页。

lzxb commented 7 years ago

只有第一页是啥意思？能上个截图么？

ALEXFUNGZH commented 7 years ago

不好意思，可能表达不完整，我描述清晰一些。 1、设置每页10条数据； 2、浏览列表页时，假设我翻页浏览到第35条数据，然后点击查看详情； 3、从详情页返回列表页时，期望是回到刚刚浏览的位置（第35条）； 4、但发现返回时却重新加载了页面，加载了第一页的列表；请问有设置返回不刷新的方法吗？还是我用的不对？我用的代码是scroll-cnode这个例子以下代码，我再List.vue的基础上改

  <!-- 设置指令监听全局滚动条 -->
  <div v-vuet-scroll.window="{ path: 'topic-list' }">
    <header>
      <ul>
        <li v-for="item in list.tabs">
          <router-link :to="{ name: 'topic-list', query: { tab: item.value } }">{{ item.label }}</router-link>
        </li>
      </ul>
    </header>
    <ul class="list" v-if="list.data.length">
      <li v-for="item in list.data">
          <router-link :to="{ name: 'topic-detail', params: { id: item.id } }">{{ item.title }}</router-link>
      </li> 
    </ul>
    <button @click="test">load</button>
  </div>
</template>
<script>
  import { mapRules, mapModules } from 'vuet'

  export default {
    mixins: [
      // 设置模块的更新规则
      mapRules({
        route: 'topic-list'
      }),
      // 连接模块的状态
      mapModules({
        list: 'topic-list'
      })
    ],
    methods:{
      test(){
        var listss = this.list;
        window.fetch(`https://cnodejs.org/api/v1/topics?mdrender=false&tab=all&limit=10`).then(function(response) {
            return response.json();
        }).then(function(json) {
            console.log(json);
            for (var i = 0; i < json.data.length; i++) {
              listss.data.push(json.data[i]);
            }
        });
      }
    }
  }
</script>
<style scoped>
  header {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 999;
    border-bottom: 1px solid #ddd;
    background: #fff;
  }
  header ul {
    padding: 0;
    margin: 0;
    display: flex;
  }
  header ul li {
    flex: auto;
    list-style: none;
  }
  header ul li a {
    display: block;
    line-height: 50px;
    text-align: center;
  }
  .list {
    padding-top: 50px;
  }
</style>

lzxb commented 7 years ago

你代码有提交到github上面吗？我可以看得更全一下

ALEXFUNGZH commented 7 years ago

不好意思，现在无法上传，我给个百度云的链接，下载运行可否？链接：http://pan.baidu.com/s/1qXKU90C 密码：btfa

lzxb commented 7 years ago

你修改成这样试试

<button @click="$vuet.fetch('topic-list')">load</button>

另外，请求更新模块的数据，统一放到fetch方法中可以参考此地址的代码

ALEXFUNGZH commented 7 years ago

用这个方法，翻页如何传递参数呢？另外，我打算和mint-ui搭配使用，主要是用下拉刷新，上拉加载更多。是否可以？

lzxb commented 7 years ago

翻页和vuet没有什么关系。肯定是可以的

lzxb / vuet

翻页后点击详细页，返回时失效 #11