草庐IT

react-native - React Native、Ionic、Flutter 和 NativeScript 中的代码可重用性(一次编写，随处使用)

coder 2023-07-23 原文

我第一次在这里写这种问题，如果我的问题不好，请原谅。

我正在学习一些新的跨平台框架。我对 Ionic(版本 4)、Flutter、React Native 和 NativeScript 很感兴趣。准确地说，我想了解每个框架的代码可重用性的概念。他们如何应用可重用性？在哪个矩阵中，结果是什么？

谢谢。

最佳答案

在 react-native 中，您可以创建任何组件使用任何屏幕。例如，我使用 InputText 组件来实现可重用性。

InputField.js

import React, { Component } from "react";
import { TextInput, View, StyleSheet, Text,Image } from "react-native";

export class InputField extends Component {
  render() {
    const {
      textentry,
      keytype,
      isvalid,
      errormsg,
      returnkey,
      textplaceholder,
      underlinecolor,
      onchangetext
    } = this.props;
    return (
      <View>
        <TextInput
          style={styles.input}
          placeholder={textplaceholder}
          keyboardType={keytype}
          placeholderTextColor="#ffffff"
          underlineColorAndroid={underlinecolor}
          secureTextEntry={textentry}
          ref={(input) => this.props.inputRef && this.props.inputRef(input)}
          returnKeyType={returnkey}
          blurOnSubmit={false}
          onSubmitEditing={(event) => {
            if (returnkey != 'done') {
                this.props.onSubmitEditing(event)
            }
        }}
          onChangeText={text => {
            this.props.onText(text);
          }}
        />
        <View>
          {!isvalid ? (
            <Text style={styles.errormsg}>{errormsg}</Text>
          ) : null}
        </View>
      </View>
    );
  }
}
const styles = StyleSheet.create({
  input: {
    width: 300,
    color: "#ffffff",
    justifyContent: "center",
    alignItems: "center",
    alignSelf: "center"
  },
  errormsg: {
    color: "#ff0000",
    marginLeft: 60
  },
});
export default InputField;

使用这个InputField组件进行筛选 Myscreen.js

import React, { Component } from "react";
import {
  View,
  StyleSheet
} from "react-native";
import { InputField } from "../component/InputField";
 render() {
    return (
<View style={{flex:1}}>
<InputField
            keytype="default"
            textplaceholder="Enter First Name"
            textentry={false}
            returnkey="next"
            isvalid={this.state.firstNameValid}
            errormsg={this.state.errormsgtext}
            underlinecolor={this.state.underLineColorFirstName}
            onText={text => {
              this.setState({ firstName: text });
            }}
            onSubmitEditing={event => {
              this.inputs["phone"].focus();
            }}
          />
</View>
)}}

关于react-native - React Native、Ionic、Flutter 和 NativeScript 中的代码可重用性(一次编写，随处使用)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/55647128/

重用随处strong34InputFieldreact-nativeionic-frameworkfluttercross-platformnativescript

有关react-native - React Native、Ionic、Flutter 和 NativeScript 中的代码可重用性(一次编写，随处使用)的更多相关文章

  1. ruby - 在 Ruby 中编写命令行实用程序 - 2

    我想用ruby​​编写一个小的命令行实用程序并将其作为gem分发。我知道安装后，Guard、Sass和Thor等某些gem可以从命令行自行运行。为了让gem像二进制文件一样可用，我需要在我的gemspec中指定什么。 最佳答案 Gem::Specification.newdo|s|...s.executable='name_of_executable'...endhttp://docs.rubygems.org/read/chapter/20 关于ruby-在Ruby中编写命令行实用程序

  2. ruby-on-rails - 错误 : Error installing pg: ERROR: Failed to build gem native extension - 2

    我克隆了一个rails仓库，我现在正尝试捆绑安装背景:OSXElCapitanruby2.2.3p173(2015-08-18修订版51636)[x86_64-darwin15]rails-v在您的Gemfile中列出的或native可用的任何gem源中找不到gem'pg(>=0)ruby​​'。运行bundleinstall以安装缺少的gem。bundleinstallFetchinggemmetadatafromhttps://rubygems.org/............Fetchingversionmetadatafromhttps://rubygems.org/...Fe

  3. ruby - 用 Ruby 编写一个简单的网络服务器 - 2

    我想在Ruby中创建一个用于开发目的的极其简单的Web服务器(不，不想使用现成的解决方案)。代码如下:#!/usr/bin/rubyrequire'socket'server=TCPServer.new('127.0.0.1',8080)whileconnection=server.acceptheaders=[]length=0whileline=connection.getsheaders想法是从命令行运行这个脚本，提供另一个脚本，它将在其标准输入上获取请求，并在其标准输出上返回完整的响应。到目前为止一切顺利，但事实证明这真的很脆弱，因为它在第二个请求上中断并出现错误:/usr/b

  4. ruby-on-rails - 如何为空白字段编写 rspec？ [Rails3.1] - 2

    我使用rails3.1+rspec和factorygirl。我对必填字段(validates_presence_of)的验证工作正常。我如何让测试将该事实用作“成功”而不是“失败”规范是:describe"Addanindustrywithnoname"docontext"Unabletocreatearecordwhenthenameisblank"dosubjectdoind=Factory.create(:industry_name_blank)endit{shouldbe_invalid}endend但是我失败了:Failures:1)Addanindustrywithnona

  5. ruby-on-rails - gem install rmagick -v 2.13.1 错误 Failed to build gem native extension on Mac OS 10.9.1 - 2

    我已经通过提供MagickWand.h的路径尝试了一切，我安装了命令工具。谁能帮帮我？$geminstallrmagick-v2.13.1Buildingnativeextensions.Thiscouldtakeawhile...ERROR:Errorinstallingrmagick:ERROR:Failedtobuildgemnativeextension./Users/ghazanfarali/.rvm/rubies/ruby-1.8.7-p357/bin/rubyextconf.rbcheckingforRubyversion>=1.8.5...yescheckingfor/

  6. ruby-on-rails - 尝试为 Rails 中的用户名验证编写 REGEX - 2

    我正在尝试用Ruby(Rails)编写一个正则表达式，以便用户名的字符仅包含数字和字母(也没有空格)。我有这个正则表达式，/^[a-zA-Z0-9]+$/，但它似乎没有用，我在Rails中收到一个错误，说“The如果正则表达式使用多行anchor(^或$)，这可能会带来安全风险。您是要使用\A和\z，还是忘记添加:multiline=>true选项？"我的user.rb模型中此实现的完整代码是:classUser我做错了什么以及如何修复此正则表达式，使其仅对数字和字母有效而不对空格有效？谢谢。 最佳答案 简短回答:使用/\A[a-z

  7. ruby - Ruby 1.9.1 中的 native 线程，对我有什么好处？ - 2

    所以，Ruby1.9.1现在是declaredstable.Rails应该与它一起工作，并且正在慢慢地将gem移植到它。它具有native线程和全局解释器锁(GIL)。自从GIL到位后，原生线程是否比1.9.1中的绿色线程有任何优势？ 最佳答案 1.9中的线程是原生的，但它们被“放慢了速度”，一次只允许一个线程运行。这是因为如果线程真的并行运行，它会混淆现有代码。优点:IO现在在线程中是异步的。如果一个线程阻塞在IO上，那么另一个线程将继续执行直到IO完成。C扩展可以使用真正的线程。缺点:任何非线程安全的C扩展都可能存在使用Thre

  8. ruby-on-rails - Ruby 长时间运行的进程对队列事件使用react - 2

    我有一个将某些事件写入队列的Rails3应用。现在我想在服务器上创建一个服务，每x秒轮询一次队列，并按计划执行其他任务。除了创建ruby​​脚本并通过cron作业运行它之外，还有其他稳定的替代方案吗？ 最佳答案 尽管启动基于Rails的持久任务是一种选择，但您可能希望查看更有序的系统，例如delayed_job或Starling管理您的工作量。我建议不要在cron中运行某些东西，因为启动整个Rails堆栈的开销可能很大。每隔几秒运行一次它是不切实际的，因为Rails上的启动时间通常为5-15秒，具体取决于您的硬件。不过，每天这样做几

  9. ruby-on-rails - 如何编写跨模型、 Controller 和 View 的 Rails mixin - 2

    为了减少我的小Rails应用程序中的代码重复，我一直致力于将我的模型之间的通用代码放入它自己的单独模块中，到目前为止一切顺利。模型的东西相当简单，我只需要在开头包含模块，例如:classIso这工作正常，但是现在，我将有一些Controller和View代码，这些代码也将在这些模型之间通用，到目前为止，我有这个用于我的可发送内容:#Thisisamodulethatisusedforpages/formsthatarecanbe"sent"#eitherviafax,email,orprinted.moduleSendablemoduleModeldefself.included(kl

  10. ruby - 在不添加 "end"的情况下编写 Ruby 的任何方法？ - 2

    按照目前的情况，这个问题不适合我们的问答形式。我们希望答案得到事实、引用或专业知识的支持，但这个问题可能会引发辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开，visitthehelpcenter指导。关闭11年前。Ruby是一种美丽的语言，但有一个我讨厌写很多次的关键词“结束”。有什么方法可以写出简洁的代码而不用每次都写“end”吗？

随机推荐