{"dist":{"shasum":"465e596ba2cb6d5ffc7e1f29b74a4ebdb25b5044","tarball":"https://registry.npmjs.org/rax-view/-/rax-view-1.1.1-1.tgz","fileCount":31,"integrity":"sha512-YbaMZRuvt2agHyf3L6Hr4xLvMFmomOzhCVsz3/ipCe8k2ysLblVBzZoxGtO5sJzBLhiH4ojLuFT3cXd+IDjyyQ==","signatures":[{"sig":"MEQCIEsoXzx78Db8VW8rwycMIlcQpbImMRHk11RsxsDyJxzlAiB8E0b/brL5kofnD+7OiFOian6X4ct02j0Zkf4UuwIzqg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":29432,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdkBbdCRA9TVsSAnZWagAADKIQAIIxZwdRBRLX2hDJCAk/\nyYUWzTQcDhbkJm5w5q97f/QeXVUzi5RrUH9LbMLOf8XTXTc/sYNkrZnklIhr\n60Gr99aOQnYp10pGE4a5OxGszTP9dndFNqp4IeMsQK4V9tXM7o//U8MN9cnU\nmWv2p+G6ly7mDwsnUjjdpG4tZq4V6s7Ez2oDfFA7VPlX+gYLHeutix2OpV7T\nT8fgC9lUeZrcWrtv6ytX2dQ3Yxs6DzMTn80kGbNVTWJKatlbmKHmjwQWb4Ln\nGpskBX7ihejVmnlg+kjgtlfHdqoLjPsNK4PGlBRO0hr7p8tUQpRoHSg6KeOp\namSu+2K7aGm6aKOztKdCx7Wm99iQSHQMb04q0kPvNGsT2XSCnnx6omDXUGxK\n30KsAGV62zJe2CZaAkTLbCzCnxr/T3qsX/u1rRYkBxxgvYkckce2j+iS27Tc\nSpBWaBMHO820s8JazBAxTQ4++ZcBor920JX1OnGVfyQG3khfpL0WI1hQ3dgv\n9kxBVwqK7AvzQEcB//kOKuif3eoikj7GdaV2FfLMP1bKkCWASrOFtnshh8zC\nYH7fCOMjJoZ9De/sknU2ItO+Y97WMnYUGZb6bNvawH3nfpjQ89KTn3AGiN+Z\nMlTjE+CgCb3/8PZ1nmBWjyYwJOiVlKFvzauTNSLwBBoOMqa1WswHsm9GmCcx\npnF4\r\n=LQGh\r\n-----END PGP SIGNATURE-----\r\n"},"main":"lib/index.js","name":"rax-view","husky":{"hooks":{"pre-commit":"lint-staged"}},"types":"lib/index.d.ts","readme":"[![npm](https://img.shields.io/npm/v/rax-view.svg)](https://www.npmjs.com/package/rax-view)\n**描述：**\nView 是最基础的组件，它支持 Flexbox、touch handling 等功能，并且可以任意嵌套。\n不论在什么容器中，View 都直接对应一个容器的原生视图，就像 web 中的 div 一样。\n支持任意自定义属性的透传。\n\n## 安装\n\n```bash\n$ npm install rax-view --save\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| className | `string` | - | false | 自定义样式名 | <img alt=\"browser\" src=\"https://gw.alicdn.com/tfs/TB1uYFobGSs3KVjSZPiXXcsiVXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"weex\" src=\"https://gw.alicdn.com/tfs/TB1jM0ebMaH3KVjSZFjXXcFWpXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"miniApp\" src=\"https://gw.alicdn.com/tfs/TB1bBpmbRCw3KVjSZFuXXcAOpXa-200-200.svg\" width=\"25px\" height=\"25px\" />|\n| style | `CSSProperties` | - | false | 自定义样式 | <img alt=\"browser\" src=\"https://gw.alicdn.com/tfs/TB1uYFobGSs3KVjSZPiXXcsiVXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"weex\" src=\"https://gw.alicdn.com/tfs/TB1jM0ebMaH3KVjSZFjXXcFWpXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"miniApp\" src=\"https://gw.alicdn.com/tfs/TB1bBpmbRCw3KVjSZFuXXcAOpXa-200-200.svg\" width=\"25px\" height=\"25px\" />|\n| onClick | `function` | - | false | 点击 | <img alt=\"browser\" src=\"https://gw.alicdn.com/tfs/TB1uYFobGSs3KVjSZPiXXcsiVXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"weex\" src=\"https://gw.alicdn.com/tfs/TB1jM0ebMaH3KVjSZFjXXcFWpXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"miniApp\" src=\"https://gw.alicdn.com/tfs/TB1bBpmbRCw3KVjSZFuXXcAOpXa-200-200.svg\" width=\"25px\" height=\"25px\" />|\n| onLongpress | `function` | - | false | 长按 | <img alt=\"browser\" src=\"https://gw.alicdn.com/tfs/TB1uYFobGSs3KVjSZPiXXcsiVXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"weex\" src=\"https://gw.alicdn.com/tfs/TB1jM0ebMaH3KVjSZFjXXcFWpXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"miniApp\" src=\"https://gw.alicdn.com/tfs/TB1bBpmbRCw3KVjSZFuXXcAOpXa-200-200.svg\" width=\"25px\" height=\"25px\" />|\n| onAppear | `function` | - | false | 当前元素可见时触发 | <img alt=\"browser\" src=\"https://gw.alicdn.com/tfs/TB1uYFobGSs3KVjSZPiXXcsiVXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"weex\" src=\"https://gw.alicdn.com/tfs/TB1jM0ebMaH3KVjSZFjXXcFWpXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"miniApp\" src=\"https://gw.alicdn.com/tfs/TB1bBpmbRCw3KVjSZFuXXcAOpXa-200-200.svg\" width=\"25px\" height=\"25px\" />|\n| onDisappear | `function` | - | false | 当前元素从可见变为不可见时触发 | <img alt=\"browser\" src=\"https://gw.alicdn.com/tfs/TB1uYFobGSs3KVjSZPiXXcsiVXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"weex\" src=\"https://gw.alicdn.com/tfs/TB1jM0ebMaH3KVjSZFjXXcFWpXa-200-200.svg\" width=\"25px\" height=\"25px\" /><img alt=\"miniApp\" src=\"https://gw.alicdn.com/tfs/TB1bBpmbRCw3KVjSZFuXXcAOpXa-200-200.svg\" width=\"25px\" height=\"25px\" />|\n| onTouchStart | `function` | - | false | 触摸动作开始 | <img alt=\"browser\" src=\"https://gw.alicdn.com/tfs/TB1uYFobGSs3KVjSZPiXXcsiVXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"weex\" src=\"https://gw.alicdn.com/tfs/TB1jM0ebMaH3KVjSZFjXXcFWpXa-200-200.svg\" width=\"25px\" height=\"25px\" /><img alt=\"miniApp\" src=\"https://gw.alicdn.com/tfs/TB1bBpmbRCw3KVjSZFuXXcAOpXa-200-200.svg\" width=\"25px\" height=\"25px\" />|\n| onTouchMove | `function` | - | false | 触摸后移动 | <img alt=\"browser\" src=\"https://gw.alicdn.com/tfs/TB1uYFobGSs3KVjSZPiXXcsiVXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"weex\" src=\"https://gw.alicdn.com/tfs/TB1jM0ebMaH3KVjSZFjXXcFWpXa-200-200.svg\" width=\"25px\" height=\"25px\" /><img alt=\"miniApp\" src=\"https://gw.alicdn.com/tfs/TB1bBpmbRCw3KVjSZFuXXcAOpXa-200-200.svg\" width=\"25px\" height=\"25px\" />|\n| onTouchEnd | `function` | - | false | 触摸动作结束 | <img alt=\"browser\" src=\"https://gw.alicdn.com/tfs/TB1uYFobGSs3KVjSZPiXXcsiVXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"weex\" src=\"https://gw.alicdn.com/tfs/TB1jM0ebMaH3KVjSZFjXXcFWpXa-200-200.svg\" width=\"25px\" height=\"25px\" /><img alt=\"miniApp\" src=\"https://gw.alicdn.com/tfs/TB1bBpmbRCw3KVjSZFuXXcAOpXa-200-200.svg\" width=\"25px\" height=\"25px\" />|\n| onTouchCancel | `function` | - | false | 触摸动作被打断，如来电提醒，弹窗 | <img alt=\"browser\" src=\"https://gw.alicdn.com/tfs/TB1uYFobGSs3KVjSZPiXXcsiVXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"weex\" src=\"https://gw.alicdn.com/tfs/TB1jM0ebMaH3KVjSZFjXXcFWpXa-200-200.svg\" width=\"25px\" height=\"25px\" /><img alt=\"miniApp\" src=\"https://gw.alicdn.com/tfs/TB1bBpmbRCw3KVjSZFuXXcAOpXa-200-200.svg\" width=\"25px\" height=\"25px\" />|\n\n```jsx\nimport { createElement, useRef, useEffect, render } from \"rax\";\nimport DU from \"driver-universal\";\nimport View from \"rax-view\";\n\nconst App = () => {\n  const viewRef = useRef(null);\n  useEffect(() => {});\n  return (\n    <View\n      ref={viewRef}\n      style={{\n        padding: 30\n      }}\n      onClick={() => {\n        alert(\"container was clicked!\");\n      }}\n    >\n      <View\n        style={{\n          width: 300,\n          height: 300,\n          backgroundColor: \"red\"\n        }}\n        onClick={e => {\n          e.stopPropagation();\n          alert(\"red was clicked\");\n        }}\n      />\n      <View\n        style={{\n          width: 300,\n          height: 300,\n          backgroundColor: \"green\",\n          position: \"absolute\",\n          top: 20,\n          left: 20\n        }}\n        onClick={() => {\n          alert(\"green was clicked\");\n        }}\n      />\n      <View\n        style={{\n          width: 300,\n          height: 300,\n          backgroundColor: \"yellow\",\n          position: \"absolute\",\n          top: 80,\n          left: 210\n        }}\n        onClick={e => {}}\n      />\n    </View>\n  );\n};\n\nrender(<App />, document.body, { driver: DU });\n```\n","engines":{"npm":">=3.0.0"},"gitHead":"990d0d9a44d71a50022892b2fd32536b20edfad2","license":"BSD-3-Clause","scripts":{"lint":"eslint --ext .js --ext .jsx --ext .ts --ext .tsx ./src","test":"npm run build","build":"npm run clean && rax-scripts build","clean":"rm -rf ./lib && rm -rf ./package-lock.json && rm -f ./yarn.lock && rm -rf demo/miniapp/lib","start":"rax-scripts start","miniapp":"rax-scripts start","prepublishOnly":"npm run build"},"_npmUser":{"name":"recover758126","email":"761647716@qq.com"},"keywords":["Rax","rax-component"],"_npmVersion":"6.11.3","description":"View component for Rax.","directories":{},"lint-staged":{"*.{js,jsx,ts,tsx}":["eslint --fix","git add"]},"maintainers":[{"name":"amdgigabyte","email":"amdgigabyte@gmail.com"},{"name":"liangzhi.llz","email":"liangzhi.llz@alibaba-inc.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":{"classnames":"^2.2.6","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","husky":"^3.0.4","eslint":"^5.16.0","csstype":"^2.6.4","driver-dom":"^1.0.0","typescript":"^3.5.3","@types/jest":"^24.0.12","driver-weex":"^1.0.0","lint-staged":"^9.2.3","rax-scripts":"^2.0.0","babel-eslint":"^10.0.3","@rax-types/rax":"^1.0.5","@types/ali-app":"^1.0.0","driver-universal":"^1.0.0","@types/classnames":"^2.2.9","eslint-config-rax":"^0.0.0","rax-test-renderer":"^1.0.0","eslint-plugin-import":"^2.18.2","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-view_1.1.1-1_1569724124897_0.005272616621092352","host":"s3://npm-registry-packages"},"_id":"rax-view@1.1.1-1","version":"1.1.1-1"}