vue和uniapp传参的区别

Vue和Uniapp都是基于Vue框架开发的，因此它们的传参方式非常相似。不过，它们在传参上还是有一些区别的。

1. 路由传参

在Vue中，通过路由跳转时，可以通过$route对象的params和query属性来传递参数。params是用于传递必选参数，而query则是用于传递可选参数，例如：

// 跳转路由时传递参数
this.$router.push({
  name: 'user',
  params: {
    userId: '123'
  },
  query: {
    name: '张三'
  }
})

// 获取参数
this.$route.params.userId // '123'
this.$route.query.name // '张三'

在Uniapp中，也是通过路由跳转来传递参数，但是它需要使用uni.navigateTo或uni.redirectTo方法来跳转页面，并且需要在url后面拼接参数，例如：

// 跳转路由时传递参数
uni.navigateTo({
  url: '/pages/user/user?id=123&name=张三'
})

// 获取参数
this.$route.query.id // '123'
this.$route.query.name // '张三'

2. 组件间传参

在Vue中，通过props属性来传递父组件传递给子组件的参数，例如：

// 父组件
<template>
  <div>
    <child :name="name" :age="age"></child>
  </div>
</template>
<script>
import Child from './Child.vue'
export default {
  components: {
    Child
  },
  data() {
    return {
      name: '张三',
      age: 18
    }
  }
}
</script>

// 子组件
<template>
  <div>
    <p>姓名：{{ name }}</p>
    <p>年龄：{{ age }}</p>
  </div>
</template>
<script>
export default {
  props: {
    name: String,
    age: Number
  }
}
</script>

在Uniapp中，也是通过props来传递参数，但是需要在子组件的props属性中加上type属性，例如：

// 父组件
<template>
  <div>
    <child :name="name" :age="age"></child>
  </div>
</template>
<script>
import Child from './Child.vue'
export default {
  components: {
    Child
  },
  data() {
    return {
      name: '张三',
      age: 18
    }
  }
}
</script>

// 子组件
<template>
  <div>
    <p>姓名：{{ name }}</p>
    <p>年龄：{{ age }}</p>
  </div>
</template>
<script>
export default {
  props: {
    name: {
      type: String,
      default: ''
    },
    age: {
      type: Number,
      default: 0
    }
  }
}
</script>

总的来说，Vue和Uniapp的传参方式很相似，但是在路由传参和组件间传参上还是有一些细微的差别。