小编Gio*_*tta的帖子

在一个getJson请求中调用多个JSON数据/文件

我有这个代码:

var graphicDataUrl = 'templating/graphic-data.json';
var webDataUrl = 'templating/web-data.json';
var templateHtml = 'templating/templating.html';
var viewG = $('#view-graphic');
var viewW = $('#view-web');

$.getJSON(dataUrls, function(data) {
    $.get(templateHtml, function(template) {
        template = Handlebars.compile(template);
        var example = template({ works: data });        
        viewG.html(example);
        viewW.html(example);
    }); 
});
Run Code Online (Sandbox Code Playgroud)

调用两个dataUrl JSON并使用它们的数据以便在我的页面上的两个不同div(#viewW和#viewW)中显示它们的最佳方法是什么?

jquery json

11
推荐指数
2
解决办法
3万
查看次数

Nextjs 生产所需的最小文件结构

我正在努力理解部署 nextjs 应用程序的正确方法或最佳方法。我有一个混合 Nextjs 网站,目前托管在 Azure 应用服务上。到目前为止我跑

  • npm 构建
  • npm start 应用程序编译时没有错误,我在 Azure 上托管应用程序的所有内容,其中包含
  • 。下一个/
  • 成分/
  • 页数/
  • ...所有配置
  • ..所有js文件

从 Nextjs 文档(在这个主题上有点薄弱)来看,似乎这是正确的方法。据我了解,.next/生产时只需要该文件夹,因为该文件夹已捆绑代码。pages/、等components/应该仅在开发模式下使用。

我还在网上找到了一些其他朝着这个方向发展的例子。如果我尝试删除 /pages 或 /components,我会收到错误,并且应用程序无法再运行。

有人可以向我确认 Nextjs 应用程序在生产环境中所需的最小文件结构是什么吗?

更新:

我得到的错误是第一个: ENOENT: no such file or directory, i18n

当我添加此文件时,出现错误:

ENOENT: no such file or directory, pages/

i18n.js是包的配置文件next-tralsation https://github.com/vinissimus/next-translate

我也在与作者交谈,这可能是他们的问题,但现在我只想知道生产中的混合 Nextjs.js 应用程序是否应该包含pages/文件夹。我想知道.next/文件夹是否足以用于生产部署,如果不够,我想了解原因。

production build next.js

5
推荐指数
1
解决办法
2951
查看次数

使用Ember.js构建搜索框搜索

我想在我的Notes.Application中构建一个简单的搜索框来搜索我的笔记.我正在寻找这个网站,Ember表格和谷歌,并没有那么多的解决方案.我发现只有两个,他们不适合我的应用程序皱眉.问题是我不知道如何做到这一点.

这是我的应用程序:

<script type="text/x-handlebars" data-template-name="index">  
    <div class="wrap">
      <div class="bar">
      {{input type="text" class="search" placeholder="Where is my bookmark??" value=search action="query"}}

        <div class="bar-buttons">
          <button {{action "addNote"}}> NEW </button>
          <button> HOME </button>
        </div>
      </div>
      <aside>
        <h4 class="all-notes">All Notes {{length}}</h4>
          {{#each item in model}}
            <li>
              {{#link-to 'note' item}} {{item.title}} {{/link-to}}
            </li>
          {{/each}}
      </aside>
      {{outlet}}
    </div> 
</script>
Run Code Online (Sandbox Code Playgroud)

控制器:

Notes.IndexController = Ember.ArrayController.extend ({
search: '',

actions:{
    query: function() {
      // the current value of the text field
      var query = this.get('search');
    },

    addNote: function () {
        this.transitionToRoute('main'); …
Run Code Online (Sandbox Code Playgroud)

javascript ember.js ember-data

4
推荐指数
1
解决办法
6099
查看次数

使用ES6和React对Array进行解构和重新排序

我想使用一个解构解决方案来重新排序我的React容器中的数组,这应该是非常简单的.给定一个数组a1 = ['hello', 'hi', 'hola']

componentDidMount() {
  const { a1 } = this.props
  this.a2 = []
  [a2[2], a2[0], a2[1]] = a1  --> this line give an error!!
  console.log('new ordered array', a2) // ['hola', 'hello', 'hi'] --> this print properly my new array
}
Run Code Online (Sandbox Code Playgroud)

如果我尝试控制日志或在渲染中使用它我得到了undefined 我在该行得到的错误是:

Uncaught (in promise) TypeError: Cannot set property '#<Object>' of undefined

我真的不明白为什么我可以正确地打印值,console.log但当我尝试在代码中实际使用它时它不起作用.它可能与React循环相关吗?我也尝试在我的州内使用它但得到了同样的错误.

javascript arrays ecmascript-6 reactjs

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

为什么在我的ReactJS代码中未定义this.props?

在我学习React和ES6的路上,我参加了官方教程,并开始使其与ES6兼容.但是当涉及到执行Ajax请求时,我收到以下错误:

CommentBox.js:23未捕获TypeError:无法读取未定义的属性'url'

这是我的CommentBox文件/代码:

import React from 'react';
import CommentList from './CommentList.js';
import CommentForm from './CommentForm.js';

export default class CommentBox extends React.Component {
  constructor(props) {
    super(props);
    console.log(this.props)
    this.state = {
      data: []
    }
  }

  loadCommentsFromServer() {
    $.ajax({
      url: this.props.url,
      dataType: 'json',
      cache: false,
      success: function(data) {
        this.setState({data: data});
      }.bind(this),
      error: function(xhr, status, err) {
        console.error(this.props.url, status, err.toString());
      }.bind(this)
    });
  }

  handleCommentSubmit(comment) {
    let comments = this.state.data;

    // Optimistically set  id on the new comment.
    // It will be replaced by an …
Run Code Online (Sandbox Code Playgroud)

ecmascript-6 reactjs

1
推荐指数
1
解决办法
1977
查看次数