# data-view-rel

**声明位置：**

任意 DOM 元素。

**是否必须：**

否。

**属性取值：**

1. 目标视图ID
2. 目标视图ID及目标视图命名空间
3. 目标视图及视图选项
4. 视图名称
5. 外部链接

例如：

```markup
<!-- 跳转至 default 命名空间下ID为 profile 的视图 -->
<span data-view-rel="profile">个人中心</span>

<!-- 跳转至 b2c-mall 命名空间下ID为 home-page 的视图 -->
<span data-view-rel="home-page@b2c-mall">积分商城</span>

<!-- 跳转至 default 命名空间下ID为 profile 的视图 -->
<!-- 使用视图选项携带1个参数：showFooter=false -->
<!-- '!' 符号是视图信息与视图选项的分隔符 -->
<span data-view-rel="profile!showFooter=false">个人中心</span>

<!-- 跳转至 default 命名空间下ID为 goods-detail 的视图 -->
<!-- 使用视图选项携带2个参数：id=G01 和 count=2 -->
<span data-view-rel="goods-detail!id=G01&count=2">商品详情</span>


<!-- 跳转至 视图名称 -->
<!-- '~' 符号用于告诉 View.js 后边的内容是 视图名称 -->
<span data-view-rel="~profile">商品详情</span>

<!-- 跳转至 视图名称 -->
<!-- 同样可以使用视图选项传递参数 -->
<span data-view-rel="~goods-detail!id=G01&count=2">商品详情</span>


<!-- 跳转至 相同目录的 page2.html -->
<!-- '@' 符号用于告诉 View.js 后边的内容是外部链接 -->
<span data-view-rel="@page2.html">商品详情</span>

<!-- 跳转至 sub 目录的 sub1.html -->
<span data-view-rel="@sub/page2.html">商品详情</span>

<!-- 跳转至 view-js.com -->
<span data-view-rel="@http://view-js.com">商品详情</span>

<!-- 跳转至 view-js.com -->
<!-- 当跳转目标是 http:// 或 https:// 或 ftp:// 开头时，可以忽略 '@' 符号 -->
<span data-view-rel="http://view-js.com">商品详情</span>

<!-- 打开拨号界面 -->
<span data-view-rel="400666666">400-666-666</span>
```