声明式导导航 <navigator>

导航组件属性
item	desc
target	打开位置 self：当前小程序；默认 miniProgram：外部小程序
url	跳转链接\|地址；相对地址或绝对地址
open-type	跳转类型 navigate：默认，也可以是外部小程序 switchTab：到标签页
delta	数字，后退的层级；默认是1，可以省略
app-id	外部小程序的AppID；在更多资料中获取
path	外部小程序的页面
extra-data	传递给外部小程序的数据
hover-class	指定点击时的样式类；none 时，没有点击态效果；或修改默认的导航类样式 navigator-hover

<navigator url="../test/test">To Page Test</navigator>

<navigator app-id="wx91d27dbf599dff74" target="miniProgram">To JD</navigator>

<navigator url="../photo/photo" open-type="switchTab">To Tab Photo </navigator>

<navigator open-type="navigate">Back</navigator>

参数和url之间使用 ? 连接

多个参数以 & 分隔

静态数据 - url?name=value&...

<navigator url="../test/test?name=gl">To Page Test</navigator>

动态数据 - 使用数据绑定

<navigator url="../test/test?name={{uname}}">To Page Test</navigator>

onLoad(option) {
    console.log(option);
}

请尽量使用调试器的"预览"体验完整功能

模拟器底部状态栏，默认显示"页面路径"，也可以切换到"页面参数"观察页面之间的参数传递情况

[] 使用声明式导航，完成个人小程序各页面之间的导航

<navigator url="../team/team" class="item">
    <text class="iconfont icon-like icon"></text>
    <text>团队</text>
</navigator>

.navigator-hover {
  background-color: rgba(0, 0, 0, 0.1);
  opacity: 0.7;
}

.navigator-hover {
  background-color: rgba(0, 0, 0, 0.0);
  opacity: 1;
}