草庐IT

javascript - 在 React Native 中设计星形图案

coder 2024-12-24 原文

我试图在 React Native 中绘制星星图案，而不是星星，应该是方框。

星星图案看起来像这样

****
****
****
****
****

在 Vanila JS 中，它看起来像 

let rows=5;
 for(let i=1; i <= 5; i++) {
  for(let j=1; j<=5; j++){   
   document.write('*');
  }
  document.write('<br />');
}

但那是 vanila JS，我想在 React-native 功能组件中做同样的事情，然后在 JSX 中显示它

将此视为我在 React Native 中的功能组件

let numberOfBoxesRequired = 4; 
let array = []

const gridBoxes  = (props) => {

    for (let i=0; i<numberOfBoxesRequired; i++) {
        for (let j=0; j<numberOfBoxesRequired; j++) {

        }
    }
    return (
        <View style={mainGridBox}>  

        </View>
    )
}

问题:我该怎么做？

最佳答案

在 vanilla JavaScript 和 React 中是一样的:

const starLines = Array(4).fill('*'.repeat(4));

一旦有了数据，它就可以以特定于当前应用程序的方式输出。

在纯 JavaScript 中:

document.write(starLines.join('<br />'));

在 React Native 中:

<View style={mainGridBox}>{starLines.map(line => <Text>{line}</Text>)}</View>

关于javascript - 在 React Native 中设计星形图案，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/53374272/

中设javascriptcodesectionprereactjsreact-native

有关javascript - 在 React Native 中设计星形图案的更多相关文章

  1. ruby-on-rails - 如何在 Rails 中设置路由的默认格式？ - 2

    路由有如下代码:resources:orders,only:[:create],defaults:{format:'json'}resources:users,only:[:create,:update],defaults:{format:'json'}resources:delivery_types,only:[:index],defaults:{format:'json'}resources:time_corrections,only:[:index],defaults:{format:'json'}是否可以使用1个字符串为所有资源设置默认格式，每行不带“默认值”散列？谢谢。

  2. ruby-on-rails - environment.rb 中设置的常量在开发模式中消失 - 2

    了解Rails缓存如何工作的人可以真正帮助我。这是嵌套在Rails::Initializer.runblock中的代码:config.after_initializedoSomeClass.const_set'SOME_CONST','SOME_VAL'end现在，如果我运行script/server并发出请求，一切都很好。然而，在我的Rails应用程序的第二个请求中，一切都因单元化常量错误而变得糟糕。在生产模式下，我可以成功发出第二个请求，这意味着常量仍然存在。我已通过将以上内容更改为以下内容来解决问题:config.after_initializedorequire'some_cl

  3. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法？ - 2

    我遇到了一个非常奇怪的问题，我很难解决。在我看来，我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时，我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性，其中包括href和data-method。再次单击此链接后，我的服务器收到了对新href的请求，但使用的是旧的data-method，即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是，如果我刷新页面，HTML与"new"HTML相同(随返回的JS发生变化)，但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  4. ruby-on-rails - 如何在回形针 ruby​​ on rails 中设置默认图像 - 2

    最近我安装了Paperclipgem，我正在努力让默认图像在我的系统上工作，我将图像文件放在assets/images/pic.png中。这是我的模型User中的代码:has_attached_file:pic,:styles=>{:medium=>"300x300>",:thumb=>"100x100>"},:default_url=>'missing_:avatar.png'#:default_url=>'assets/images/avatar.png'has_attached_file:attach这是我的AddPicPaperClip迁移中的代码:defself.upadd_

  5. ruby-on-rails - Rails 中的类实例变量应该在互斥体中设置吗？ - 2

    假设我的Rails项目中有一个设置实例变量的Ruby类。classSomethingdefself.objects@objects||=begin#somelogicthatbuildsanarray,whichisultimatelystoredin@objectsendendend是否可以多次设置@objects？是否有可能在一个请求期间，在上面的begin/end之间执行代码时，可以在第二个请求期间调用此方法？我想这实际上归结为Rails服务器实例如何fork的问题。我应该改用Mutex还是线程同步？例如:classSomethingdefself.objectsreturn@o

  6. ruby - 在 Mechanize 中使用 JavaScript 单击链接 - 2

    我有这个:AccountSummary我想单击该链接，但在使用link_to时出现错误。我试过:bot.click(page.link_with(:href=>/menu_home/))bot.click(page.link_with(:class=>'top_level_active'))bot.click(page.link_with(:href=>/AccountSummary/))我得到的错误是:NoMethodError:nil:NilClass的未定义方法“[]” 最佳答案 那是一个javascript链接。Mechan

  7. ruby-on-rails - 如何在 ActionController::TestCase 请求中设置内容类型 - 2

    我试图像这样在我的测试用例中执行获取:request.env['CONTENT_TYPE']='application/json'get:index,:application_name=>"Heka"虽然，它失败了:ActionView::MissingTemplate:Missingtemplatealarm_events/indexwith{:handlers=>[:builder,:haml,:erb,:rjs,:rhtml,:rxml],:locale=>[:en,:en],:formats=>[:html]尽管在我的Controller中我有:respond_to:html,

  8. ruby-on-rails - 在条件路由期间未在 Rails 3 中设置 request.subdomain - 2

    我正在尝试根据RyanBatesscreencastonsubdomains在Rails3中设置子域.但是它对我不起作用。我有以下设置:#routes.rbconstraints(Subdomain)doget'devices'=>'devices#all'end#lib/subdomain.rbclassSubdomaindefself.matches?(request)#binding.pryrequest.subdomain.present?&&request.subdomain=="admin"endend加载urladmin.localhost:3000/devices应该将

  9. javascript - jQuery 的 jquery-1.10.2.min.map 正在触发 404(未找到) - 2

    我看到有关未找到文件min.map的错误消息:GETjQuery'sjquery-1.10.2.min.mapistriggeringa404(NotFound)截图这是从哪里来的？ 最佳答案 如果ChromeDevTools报告.map文件的404(可能是jquery-1.10.2.min.map、jquery.min.map或jquery-2.0.3.min.map，但任何事情都可能发生)首先要知道的是，这仅在使用DevTools时才会请求。您的用户不会遇到此404。现在您可以修复此问题或禁用sourcemap功能。修复:获取文

  10. ruby - 如何在 BigQuery Ruby API 中设置 BillingTier？ - 2

    我的一些查询返回billingTierLimitExceeded错误，对其进行故障排除后我找到了文档，告诉我更改查询作业的配置。我在RESTAPI中找到了configuration.query.maximumBillingTier，但在Ruby客户端库中找不到。如何使用RubySDK设置configuration.query.maximumBillingTier？ 最佳答案 要在更高的定价层运行查询，请将新值作为查询请求的一部分传递给maximumBillingTier，方法与传递其他属性的方式相同。请参见引用here.例如，您可以

随机推荐