npm package: @retailwe/ui-error
Description: ## 引入
Latest version: 0.0.20

# error 错误内容

## 引入

全局引入，在 miniprogram 根目录下的`app.json`中配置，局部引入，在需要引入的页面或组件的`index.json`中配置。

```json
// app.json 或 index.json
"usingComponents": {
  "wr-error": "@retailwe/ui-error/index"
}
```

## 代码演示

### 基础用法

```html
<view style="width: 100%; height: 300rpx;">
  <wr-error>Not Found</wr-error>
</view>
```

### 指定图片地址

```html
<view style="width: 100%; height: 300rpx;">
  <wr-error
    size="150rpx"
    src="https://cdn.ghsmpwalmart.com/saas/market/image/empty/no_cart.png"
    >Not Found</wr-error
  >
</view>
```

### 放置彩蛋

```html
<view style="width: 100%; height: 300rpx;">
  <wr-error egg="{{egg}}">Not Found</wr-error>
</view>
```

```js
Page({
  data: {
    egg: {
      num: 5,
      msg: '错误内容...',
    },
});
```

### 设置彩蛋预警

```js
Page({
  data: {
    egg: {
      num: 5,
      msg: '错误内容...',
      tip: {
        num: 3,
      },
    },
});
```

### 自定义彩蛋预警提示

```js
Page({
  data: {
    egg: {
      num: 5,
      msg: '错误内容...',
      tip: {
        num: 3,
        msg: '住手! 再来{num}下就露馅了~',
      },
    },
});
```

### 自定义彩蛋点击间隔（超过间隔时间没点，已点次数清零）

```js
Page({
  data: {
    egg:  {
      num: 5,
      msg: '错误内容...',
      tip: {
        num: 3,
      },
      timeout: 300,
    },
});
```

## API

### error Props

| 参数      | 说明                       | 类型     | 默认值                                                              | 版本 |
| --------- | -------------------------- | -------- | ------------------------------------------------------------------- | ---- |
| src       | 图片地址                   | _string_ | `https://cdn.ghsmpwalmart.com/saas/market/image/error/no_goods.png` | -    |
| size      | 图片大小                   | _string_ | `100rpx`                                                            | -    |
| textSize  | 文字大小                   | _string_ | `24rpx`                                                             | -    |
| textColor | 文字颜色                   | _string_ | `#969799`                                                           | -    |
| backColor | 背景颜色                   | _string_ | -                                                                   | -    |
| egg       | 彩蛋，包含属性`num`和`msg` | _object_ | `null`                                                              | -    |

### egg

| 参数    | 说明                           | 类型     | 默认值 | 版本 |
| ------- | ------------------------------ | -------- | ------ | ---- |
| num     | 开启彩蛋需要点击的次数，必填   | _number_ | -      | -    |
| msg     | 彩蛋的文字内容                 | _string_ | -      | -    |
| tip     | 剩余点击次数提示相关，可选     | _object_ | -      | -    |
| timeout | 最小点击间隔，超时重置已点次数 | _number_ | `2000` | -    |

### egg.tip

| 参数 | 说明                                          | 类型     | 默认值                    | 版本 |
| ---- | --------------------------------------------- | -------- | ------------------------- | ---- |
| num  | 显示提示需要的点击次数，必填                  | _number_ | -                         | -    |
| msg  | 彩蛋的文字内容模板，可通过`{num}`插入剩余次数 | _string_ | `"再点${num}次打开彩蛋~"` | -    |

### Slots

| 名称 | 说明     |
| ---- | -------- |
| -    | 错误文案 |

### error 外部样式类

| 类名     | 说明         |
| -------- | ------------ |
| wr-class | 根节点样式类 |