zoukankan      html  css  js  c++  java
  • vue页面之间数据的传递

    vue是由一个个组件组合而成的页面,今天我们就来说一下页面之间数据的传递. 
    我们经常会在后台管理系统看到用户详情,有添加用户和编辑用户.有时候我们的添加和编辑是在同一页面上以模态框的形式展现的,但有的时候则是以另一兄弟页面的形式展示的,这个时候就需要从主页面向兄弟页面进行传值.在vue中是怎么做到的呢?今天我们用举例子的方式介绍一下. 
    在我们现在做的后台管理系统中,有组织机构的页面. 
    这里写图片描述
    我们想要的效果是点击树节点获取到组织详情和组织下的人员详情,但这里我们不做过多的介绍,就是一般的后台请求接口的方式,现在我们可以看到上面有两个按钮,分别是添加和编辑. 
    我们现在说一下编辑 我们先点击树节点获取到相应的组织结构 
    这里写图片描述
    然后如果我们想要编辑组织详情的话,点击编辑(因为内容多)我们想要跳转到另一个页面 
    这里写图片描述 
    因为路径不同,数据该怎样从详情页面传递到编辑页面的呢? 
    这里写图片描述 
    我们点击编辑按钮的时候跳转到我们编辑的路径,同样需要传递给我们编辑页面的有我们向后台获取组织详情时候的id,然后我们在编辑页面需要接收这个id然后在初始化的时候向后台传递这个id,获取相应的详情即可. 
    这里写图片描述
    正常的情况下我们接收到需要的id即可.让我们编辑的内容和从后台获取的内容相互绑定即可.这个时候编辑页面的数据就是和详情页面的是一样的. 

  • 相关阅读:
    树的直径
    Codeforces 734E Anton and Tree(缩点+树的直径)
    Codeforces 948D Perfect Security(字典树)
    Codeforces 954D Fight Against Traffic(BFS 最短路)
    Codeforces 954C Matrix Walk (思维)
    Codeforces 950D A Leapfrog in the Array (思维)
    Codeforces 946D
    Invitation Cards POJ-1511 (spfa)
    spfa 单源最短路究极算法
    Currency Exchange POJ
  • 原文地址:https://www.cnblogs.com/moxiaowohuwei/p/7388257.html
Copyright © 2011-2022 走看看