小编Téw*_*éwa的帖子

React Native - 如何使图像宽度100%和垂直顶部?

我是反应原生的新手.我想要做的是在设备中放置图像并保持图像的比例.我只想做width : 100%

我搜索了如何制作它,似乎resizeMode = 'contain'对此有好处.

但是,自从我使用以来resizeMode = 'contain',图像保持垂直居中的位置,这是我不想要的.我希望它垂直顶部.

我试图使用一个插件,如react-native-fit-image,但没有运气.

我找到了图像没有自动调整大小的原因.但我仍然不知道如何制作它.

所以,我的问题是处理这种情况的最佳方法是什么?

我是否必须手动width, height为每张图片放大小?

我想要 :

  • 保持图像的比例.
  • 垂直顶部定位.

反应本机测试代码:

https://snack.expo.io/ry3_W53rW

最终我要做的是:

https://jsfiddle.net/hadeath03/mb43awLr/

谢谢.

image-resizing react-native

22
推荐指数
1
解决办法
3万
查看次数

如何防止Angular双击?

我有一个组件click.

<my-box (click)="openModal()"></my-box>
Run Code Online (Sandbox Code Playgroud)

当我单击此元素时,openModal函数将运行.而且我想给出1000ms的节流时间以防止打开多个模态.

我的第一种方法是使用Subject(来自rxJs)

//html
<my-box (click)="someSubject$.next()"></my-box>
//ts
public someSubject$:Subject<any> = new Subject();
...etc subscribe
Run Code Online (Sandbox Code Playgroud)

但我觉得它有点冗长.

Next Approach正在使用a directive.我修改了一些我通过谷歌搜索找到的代码.

//ts
import {Directive, HostListener} from '@angular/core';

@Directive({
    selector: '[noDoubleClick]'
})
export class PreventDoubleClickDirective {

    constructor() {
    }

    @HostListener('click', ['$event'])
    clickEvent(event) {
        event.stopPropagation();    // not working as I expected.
        event.preventDefault();     // not working as I expected.

        event.srcElement.setAttribute('disabled', true);    // it won't be working unless the element is input.
        event.srcElement.setAttribute('style', 'pointer-events: none;');   // test if …
Run Code Online (Sandbox Code Playgroud)

rxjs angular-directive angular

8
推荐指数
4
解决办法
9239
查看次数