V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
zhang14964
V2EX  ›  Vue.js

问个 vue 基础问题

  •  
  •   zhang14964 · 2020-06-05 16:51:16 +08:00 · 2405 次点击
    这是一个创建于 1631 天前的主题,其中的信息可能已经有所发展或是发生改变。

    通过路由传 query 参数 Number 到下一页面,页面刷新后参数会变成 string 可以从什么原理来解释么

    10 条回复    2020-06-30 15:06:37 +08:00
    TsubasaHanekaw
        1
    TsubasaHanekaw  
       2020-06-05 16:55:31 +08:00
    queryString 都是字符串啊 你得自己转
    planck1213
        2
    planck1213  
       2020-06-05 16:59:24 +08:00
    用 param 传试试
    zhang14964
        3
    zhang14964  
    OP
       2020-06-05 17:02:33 +08:00
    @TsubasaHanekaw 页面跳转在 created 阶段 打印 this.$router.id 类型是 Number
    zhw2590582
        4
    zhw2590582  
       2020-06-05 17:09:44 +08:00
    好久以前也遇到过这个问题
    windychen0
        5
    windychen0  
       2020-06-05 18:01:50 +08:00
    怕是在调 query 的时候先取 vm 内的数据,没有的话再取 url 的数据,刷新会重新构建 vm 对象,所以内部的 query 数据被清了,取的 url 上的数据自然是 string 了
    GzhiYi
        6
    GzhiYi  
       2020-06-05 18:27:40 +08:00
    可以对传入 query 之前的数据做一下类型,在取回来的时候进行类型匹配
    TsubasaHanekaw
        7
    TsubasaHanekaw  
       2020-06-05 18:30:13 +08:00
    @zhang14964 参数来源不一样 , 你使用 push 是通过监听 route 变换去修改 vm 实例中的数据,刷新页面相当于初始化操作,vue-route 是从当前 Url 里用 parseQueryString 函数解析 queryString 这时候拿到的都是字符串了,
    MrUser
        8
    MrUser  
       2020-06-06 08:04:32 +08:00
    URL 是个字符串,所以从 URL 里取出的东西也是字符串,query 就是 URL 中 ? 后边 # 前边的部分。
    另外 HTML 属性值本身也是 字符串(<a data-id="56"……,这个 56 也是字符串)
    zhang14964
        9
    zhang14964  
    OP
       2020-06-06 08:48:45 +08:00
    纠正一下是打印 this.$route.query.id , 应该更倾向于 7L 大佬的解释,我去瞅瞅源码
    fenyu
        10
    fenyu  
       2020-06-30 15:06:37 +08:00
    因为 url 就是字符串啊,同 7 楼解释,不过我补充一些 url 通用概念,可能不同也希望有大佬指正
    url 构成是 协议://服务器(域名|ip)(:端口号)/实际请求地址(?query 参数,按照标准 使用名称=值,&连接)(#hash,一种 html 会认可的东西,原生 html 状态下#aaa 页面会被自动定位到 id=aaa 的元素)
    另外 get 请求时候只有 query 参数
    post 请求时候参数分为 query 和 body,query 显示在 url 上,body 是内容(主流分为 x-www-formdata:格式类似于 query,只能传字符串,formdata:只能字符串或文件,json:带类型但是不能传文件,类型不懂请查 json 标准)
    另外多提一下,vue-router 里的 param 似乎是内部传递,也就是页面重载会无效
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5108 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 29ms · UTC 09:34 · PVG 17:34 · LAX 01:34 · JFK 04:34
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.