暫無描述

Uploads.tsx 1.9KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. import React, {Component} from 'react';
  2. import {Button, Linking, Text, View} from 'react-native';
  3. import WebView from 'react-native-webview';
  4. const HTML = `
  5. <!DOCTYPE html>\n
  6. <html>
  7. <head>
  8. <title>Uploads</title>
  9. <meta http-equiv="content-type" content="text/html; charset=utf-8">
  10. <meta name="viewport" content="width=320, user-scalable=no">
  11. <style type="text/css">
  12. body {
  13. margin: 0;
  14. padding: 0;
  15. font: 62.5% arial, sans-serif;
  16. background: #ccc;
  17. }
  18. </style>
  19. </head>
  20. <body>
  21. <p>
  22. <label for="images-only">Images only file upload</label>
  23. <input name="images-only" type="file" accept="image/*">
  24. </p>
  25. <p>
  26. <label for="video-only">Video only file upload</label>
  27. <input name="video-only" type="file" accept="video/*">
  28. </p>
  29. <p>
  30. <label for="any-file">Any file upload</label>
  31. <input name="any-file" type="file">
  32. </p>
  33. </body>
  34. </html>
  35. `;
  36. type Props = {};
  37. type State = {};
  38. export default class Uploads extends Component<Props, State> {
  39. state = {};
  40. render() {
  41. return (
  42. <View>
  43. <View style={{ height: 120 }}>
  44. <WebView
  45. source={{html: HTML}}
  46. automaticallyAdjustContentInsets={false}
  47. />
  48. </View>
  49. <Text>
  50. Android limitation: If the file input should show camera options for the user,
  51. and the app has the ability to request the camera permission, then the user must
  52. grant permission first in order to see the options. Since this example app does
  53. have the permission declared, you must allow it in settings to be able to see
  54. camera options. If your app does not have the camera permission declared, then
  55. there is no restriction to showing the camera options.
  56. </Text>
  57. <Button
  58. title="Open settings"
  59. onPress={() => Linking.openSettings()}
  60. />
  61. </View>
  62. );
  63. }
  64. }