{"bugs":{"url":"https://github.com/alibaba/rax/issues"},"dist":{"shasum":"16c351ab46c7001dc796f6485bb9ad35785d1f12","tarball":"https://registry.npmjs.org/rax-image/-/rax-image-1.1.3-0.tgz","fileCount":36,"integrity":"sha512-Ew14kDUr4BJYDrvstsvuHO5tWRIBAVdE3+eIfEoRDbclhmapSb5JI3ECIykB4dVyDoQzJsRNnK6Bu23FoZu5vg==","signatures":[{"sig":"MEYCIQCYtseJwGpYAQBHMHEiFa3VjY93y7lptDnEWR5g+UcrbQIhAIw4miT6kspkmLIy7+ktBB/7+dtgWeb/G1svUI3DRggA","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":26126,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdrooOCRA9TVsSAnZWagAA9osQAKDL9hVCDUkJKnmXLGyH\nj/wqWFkqhi5qHiH8X/lZbqP/4tIrZ9Ql8xncfq59IEdrG63pDnqiiFc5YA2D\nzNqWj21hbl0r9x4frUZVVG7wbzHA70tPVLm4EIKHT7Mkqwm0R0UBEzY7K5zn\nKuUoqmQ94c1m95yAnlIAw1I/ejkZoJCJWAZ/5ebl3ha93q/lD0dv7bgnZfrL\nHL9GJv+heVZQqsDwlIImg2NjW5fCgxiJjvkKDWdx95oddbzw9mvQMeoolki2\nY+bZT/UujMyIIci8YGudBbjGkyypY+gai6IABxh9vWgsTWWFDmFYQPm2RgPh\nUswXS9j79311r339oVvfi8RjF+7n1IIKciFUZka8GPZJAc6Aja0QKykqfImI\nNQi7u1ij8rGA5pCzufJDg4g8IFUrvwXyg1DTRlwiVmo5GACZcNlJRrELugkX\n8hdVQIYmp0U68p5gjgG2zTrLDDYqL0dtkvIsUD5yB+DdzZcrS20bPyMzRdxN\nMd9Tuqly30vKWwtdSJParG7bgvChmP0vbZnB2F+NbBVRC3854TgjbJyuZ8Je\nTLc11LOQXiyFTvgpwOsPw1IynTsw2XhFNWqI/Cx1NjCD+OU4WQfNr8S2Qyk4\nT9ZcVEucbdkvpLTfYhXtUz/qwCQXahI0IG26Jh+pQIYBC7GMkoJ6rtyb3RYO\neHZW\r\n=VkJV\r\n-----END PGP SIGNATURE-----\r\n"},"main":"lib/index.js","name":"rax-image","types":"lib/index.d.ts","readme":"# Image\n\n[![npm](https://img.shields.io/npm/v/rax-image.svg)](https://www.npmjs.com/package/rax-image)\n\n\n**描述：**\nImage用于展示图片\n\n## 安装\n\n```bash\n$ npm install rax-image --save\n```\n## 引用\n\n```jsx\nimport Image from 'rax-image';\n```\n\n## 属性\n\n注：\n1、**支持**列表中的 <img alt=\"browser\" src=\"https://gw.alicdn.com/tfs/TB1uYFobGSs3KVjSZPiXXcsiVXa-200-200.svg\" width=\"25px\" height=\"25px\" />代表h5 <img alt=\"weex\" src=\"https://gw.alicdn.com/tfs/TB1jM0ebMaH3KVjSZFjXXcFWpXa-200-200.svg\" width=\"25px\" height=\"25px\" />代表weex  <img alt=\"miniApp\" src=\"https://gw.alicdn.com/tfs/TB1bBpmbRCw3KVjSZFuXXcAOpXa-200-200.svg\" width=\"25px\" height=\"25px\" />代表小程序\n\n| **属性**    | **类型**   | **默认值** | ** 必填 ** | **描述**           | ** 支持 ** |\n| ----------- | ---------- | ---------- | ------------ | ------------------ | ------------ |\n| source | `Object: {uri: String}` | - |   true | 设置图片的 uri | ALL |\n| style | `Object: { width: Number height: Number }` | - | true | 图片样式 width和height为必填属性，否则图片无法正常展示，可以补充其他属性| ALL |\n| fallbackSource | `Object: {uri: String}` | - | false | 备用图片的uri（当主图加载失败是加载） | ALL |\n| resizeMode | `String： 'contain' 'cover' 'stretch'` | - | false | 决定当组件尺寸和图片尺寸不成比例的时候如何调整图片的大小 | ALL |\n| quality | `String: 'original' 'normal' 'low' 'high' 'auto'` | - | false | 图片质量 | <img alt=\"weex\" src=\"https://gw.alicdn.com/tfs/TB1jM0ebMaH3KVjSZFjXXcFWpXa-200-200.svg\" width=\"25px\" height=\"25px\" />|\n| placeholder | `String` | - | false | 占位图的 URL，在图片下载过程中将展示占位图，\b图片下载完成后将显示source中指定的图片。 | <img alt=\"weex\" src=\"https://gw.alicdn.com/tfs/TB1jM0ebMaH3KVjSZFjXXcFWpXa-200-200.svg\" width=\"25px\" height=\"25px\" />|\n| onLoad | `Function` | - | false | 图片加载成功的回调函数 | ALL |\n| onError | `Function` | - | false | 图片加载失败的回调函数 | ALL |\n\n\n### onLoad onError 返回\n\n当完成图片加载成功/失败时，将分别触发onLoad/onError中的回调函数 function(event) => {}\n\nweex下（iOS/Android）\n\n| **成员** | **类型** |** 描述** |\n| --- | --- | --- |\n| success | `boolean` | 标记图片是否成功加载，成功为1/true，失败为0/false |\n| size | `object` |  加载的图片大小对象 |\n| size.naturalWidth | `number` |  图片宽度，如果图片加载失败则为0/-1 |\n| size.naturalHeight | `number` |  图片高度，如果图片加载失败则为0/-1 |\n\nh5下是web原生的Event事件\n\n| **成员** | **类型** |** 描述** |\n| --- | --- | --- |\n| target | `Dom` | 图片自身元素 |\n| target.naturalWidth | `number` |  图片宽度 |\n| target.naturalHeight | `number` |  图片高度 |\n\n## 示例\n\n### 普通示例\n```jsx \nimport {createElement, render} from 'rax';\nimport DU from 'driver-universal';\nimport Image from '../src/index';\n\nconst App = () => {\n  const imageRef = useRef(null);\n  return (\n    <Image\n      ref={imageRef}\n      source={{\n        uri: 'https://gw.alicdn.com/tfs/TB1bBD0zCzqK1RjSZFpXXakSXXa-68-67.png',\n      }}\n      style={{\n        height: '68',\n        width: '67'\n      }}\n   />\n  );\n};\n\nrender(<App />, document.body, { driver: DU });\n```\n\n### 使用fallbackSource和resizeMode\n\n```jsx\nimport {createElement, render} from 'rax';\nimport DU from 'driver-universal';\nimport Image from '../src/index';\n\nconst App = () => {\n  return (\n    <Image\n      source={{\n        uri: 'https://gw.alicdn.com/tfs/TB1g6AvPVXXXXa7XpXXXXXXXXXX-215-215.png'\n      }}\n      fallbackSource={{\n        uri: 'https://gw.alicdn.com/tps/i3/TB1yeWeIFXXXXX5XFXXuAZJYXXX-210-210.png_70x70.jpg'\n      }}\n      style={{\n        width: 100,\n        height: 100,\n      }}\n      resizeMode=\"cover\"\n    />\n  );\n};\n\nrender(<App />, document.body, { driver: DU });\n```\n","engines":{"npm":">=3.0.0"},"license":"BSD-3-Clause","scripts":{"lint":"eslint --ext .js --ext .jsx --ext .ts --ext .tsx ./src","test":"npm run build && rax-scripts test","build":"npm run clean && rax-scripts build","clean":"rm -rf ./lib ./package-lock.json ./demo/miniapp/lib ","start":"rax-scripts start","prepublishOnly":"npm run build"},"_npmUser":{"name":"recover758126","email":"761647716@qq.com"},"homepage":"https://github.com/alibaba/rax#readme","keywords":["Rax","rax-component"],"repository":{"url":"git+https://github.com/raxjs/rax-components.git","type":"git"},"_npmVersion":"6.11.3","description":"Image component for Rax.","directories":{},"maintainers":[{"name":"amdgigabyte","email":"amdgigabyte@gmail.com"},{"name":"liangzhi.llz","email":"liangzhi.llz@alibaba-inc.com"},{"name":"marc.hy","email":"marc.hy@alibaba-inc.com"},{"name":"recover758126","email":"761647716@qq.com"},{"name":"wintercn","email":"csf178@gmail.com"},{"name":"yacheng","email":"narutosun2@163.com"},{"name":"yuanyan","email":"yuanyan.cao@gmail.com"},{"name":"zeroling","email":"wssgcg1213@qq.com"}],"_nodeVersion":"10.16.0","dependencies":{"universal-env":"^1.0.0"},"miniappConfig":{"main":"lib/miniapp/index","main:wechat":"lib/miniapp-wechat/index"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"rax":"^1.0.0","eslint":"^5.16.0","csstype":"^2.6.4","rax-text":"^1.0.1","typescript":"^3.5.3","@types/jest":"^24.0.12","rax-scripts":"^2.0.0","@rax-types/rax":"^1.0.5","@types/ali-app":"^1.0.0","driver-universal":"^1.0.0-beta.5","eslint-config-rax":"^0.0.0","rax-test-renderer":"^1.0.0","rax-plugin-component":"^0.1.9","@typescript-eslint/parser":"^1.7.0","@typescript-eslint/eslint-plugin":"^1.7.0"},"peerDependencies":{"rax":"^1.0.0"},"_npmOperationalInternal":{"tmp":"tmp/rax-image_1.1.3-0_1571719693358_0.06729072202712283","host":"s3://npm-registry-packages"},"_id":"rax-image@1.1.3-0","version":"1.1.3-0"}