小编Una*_*dra的帖子

我正在开发一个React Native应用程序,以便在iOS和Android(以及Windows,如果可能)上部署为本机应用程序.

问题是我们希望布局根据屏幕尺寸和方向而不同.

我已经制作了一些返回样式对象的函数,并在每个组件渲染的函数上调用,所以我可以在应用程序启动时应用不同的样式,但是如果应用程序初始化后方向(或屏幕的大小)发生了变化,不重新计算也不重新应用.

我已将侦听器添加到顶部渲染,以便更新其在方向更改时的状态(并且它强制渲染应用程序的其余部分),但子组件不会重新渲染(因为实际上它们尚未更改).

所以,我的问题是:如何根据屏幕大小和方向制作可能完全不同的样式,就像使用CSS媒体查询(即时呈现)一样？

我已经尝试过反应原生响应模块而没有运气.

谢谢!

我正在使用React Native 为iOS,Android和Windows开发应用程序,我需要在其中显示一个网页WebView.该网页访问设备的摄像头,因此它使用MediaDevices.getUserMedia()Javascript功能.

即使在智能手机上的Chrome应用中,它也可以在桌面上正常运行.但是,当我通过React Native调用网页时<WebView />,出现PermissionDenied错误.问题是没有显示任何请求让我接受该许可.它只是在不问的情况下否认了这个请求.

这是我的WebView元素的示例:

    <WebView 
        style={{flex: 1}}
        mediaPlaybackRequiresUserAction={false}
        domStorageEnabled={true}
        allowsInlineMediaPlayback={true}
        source={{uri: 'https://myurltomyapp.com/index.html'}} 
        startInLoadingState={true}
        allowUniversalAccessFromFileURLs={true}
    />

我已经设置了所有必要的权限AndroidManifest.xml(甚至为了测试而不需要一些权限):

    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
    <uses-permission android:name="android.permission.CAMERA" />
    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.CAPTURE_AUDIO_OUTPUT" />
    <uses-permission android:name="android.permission.CAPTURE_SECURE_VIDEO_OUTPUT" />
    <uses-permission android:name="android.permission.CAPTURE_VIDEO_OUTPUT" />
    <uses-permission android:name="android.permission.RECORD_AUDIO"/>
    <uses-permission android:name="android.permission.RECORD_VIDEO"/>
    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
    <uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
    <uses-permission android:name="android.permission.RECORD_AUDIO" />
    <uses-permission android:name="android.permission.WAKE_LOCK" …

我想创建一个自定义fetchServer方法，在执行实际的fetch.

最后，这个方法使用了fetchJavascript 的通用方法，它具有以下签名：

function fetch(input: RequestInfo | URL, init?: RequestInit | undefined): Promise<Response>

所以，我是fetchServer这样写的：

export const fetchServer = async <T>(
  url: string,
  options: any = {},
): Promise<T> => {
  ...
  const alteredOptions = { ...options, /* my custom code */ };
  const rawResponse = await fetch(url, { ...alteredOptions});
  ...
};

但是，正如您所看到的，我正在使用anyfor options，因为我无法RequestInit从任何地方成功导入该类型。

我已经读过这个问题，但它来自apollo包（我没有使用）并且没有解决。

我可以尝试自己声明它，但同样的情况也会发生在body和headers属性（具有BodyInit和HeadersInit类型）上。 …

我正在尝试创建一个可以读取用户的Dropbox文件的Webapp.如果它有助于回答问题,我请求用户名和密码.我一直在搜索,我在Google Code中找到了一个使用OAuth访问用户Dropbox中所有数据的库.

我的问题是我没有在服务器中安装OAuth.我需要安装它,但我没有物理访问服务器和php.ini文件,所以我也不能.

我的问题是,我是否可以安装它或至少模拟它将一些文件(我可以像一个类一样使用)上传到我的目录,或者如果有其他方式而不是调用主机并告诉他们安装它,如果可能的话.

如果有办法访问php.ini文件并修改它以添加OAuth扩展,或者如果可以通过.htaccess(作为最后一次机会)完成,它也会有所帮助.

谢谢.

编辑:我得到的错误是:未捕获的异常'Dropbox_Exception',消息'无法找到OAuth类!你安装并启用了oauth扩展吗？'

关于这个问题，我一直在尝试通过Android中的本机模块来完成。

我已经.../java/com/myproject/multiplecamerastream按照React Native ToastModule的示例声明了我的模块（此处的功能并不重要）：

public class MultipleCameraStreamModule extends ReactContextBaseJavaModule {

  private static final String CAMERA_FRONT = "SHORT";
  private static final String CAMERA_BACK = "LONG";

  public MultipleCameraStreamModule(ReactApplicationContext reactContext) {
    super(reactContext);
  }

  @Override
  public String getName() {
    return "MultipleCameraStream";
  }

  @Override
  public Map<String, Object> getConstants() {
    final Map<String, Object> constants = new HashMap<>();
    constants.put(CAMERA_FRONT, Toast.LENGTH_SHORT);
    constants.put(CAMERA_BACK, Toast.LENGTH_LONG);
    return constants;
  }

  @ReactMethod
  public void show(String message, int duration) {
    Toast.makeText(getReactApplicationContext(), message, duration).show();
  }
}

然后，我的模块包装器：

public class …

目标和我的尝试

我正在尝试获取一种能够等待元素已经存在于 DOM 中的方法。我读过一些关于 的文章MutationObserver，并且我得到了这个方法，它应该可以完成我所需要的：

const waitForElement = async (queryString) => {
    return new Promise((resolve) => {
      const observer = new MutationObserver((mutations) => {
        mutations.forEach((mutation) => {
          const nodes = Array.from(mutation.addedNodes);
          nodes.forEach((node) => {
            console.log('NODE CUSTOM', node);
            if (node.matches && node.matches(queryString)) {
              observer.disconnect();
              resolve(node);
            }
          });
        });
      });

      observer.observe(document.documentElement, {
        childList: true,
        subtree: true,
      });
    });
};

然后，我可以这样简单地使用它：

await waitForElement('#id-of-element');

问题

问题是它实际上没有按预期工作：console.log仅记录“父母”元素，如果要搜索的元素位于树的深处，则似乎不会记录它（这正在更复杂的应用程序中使用） ，所以它可能与异步调用等有关）。

问题

然而，我发现，我只需要查看实际元素是否在 DOM 中，而不是遍历突变和节点数组，所以我实现了这个：

const waitForElement = async (queryString) => { …