那些遇到过的问题

小编Ben*_*mas的帖子

动态渲染React组件

在React JSX中,似乎不可能做这样的事情:

render: function() {
  return (
    <{this.props.component.slug} className='text'>
      {this.props.component.value}
    </{this.props.component.slug}>
  );
}
Run Code Online (Sandbox Code Playgroud)

我得到一个解析错误:意外的令牌{.这不是React可以处理的吗？

我正在设计这个组件,以便在引擎盖下,存储的值this.props.component.slug将包含有效的HTML元素(h1,p等).有没有办法让这项工作？

javascript reactjs

eri*_*per
2018 07-05
78
推荐指数
3
解决办法
7万
查看次数

CSS边栏高度100%

我一直在撞墙,试图弄清楚这个问题并认为它必须是我想念的小东西.我在网上搜索过,但我发现的任何东西似乎都没有用.HTML是:

<body>
  <div id="header">
    <div id="bannerleft">
    </div>

    <div id="bannerright">
      <div id="WebLinks">
        <span>Web Links:</span>
        <ul>
          <li><a href="#"><img src="../../Content/images/MySpace_32x32.png" alt="MySpace"/></a></li>
          <li><a href="#"><img src="../../Content/images/FaceBook_32x32.png" alt="Facebook"/></a></li>
          <li><a href="#"><img src="../../Content/images/Youtube_32x32.png" alt="YouTube"/></a></li>
        </ul>
      </div>
    </div>
  </div>
  <div id="Sidebar">
    <div id="SidebarBottom">
    </div>
  </div>
  <div id="NavigationContainer">
    <ul id="Navigation">
      <li><a href="#">Nav</a></li>
      <li><a href="#">Nav</a></li>
      <li><a href="#">Nav</a></li>
      <li><a href="#">Nav</a></li>
      <li><a href="#">Nav</a></li>
      <li><a href="#">Nav</a></li>
    </ul>
  </div>
  <div id="Main">
    <!-- content -->
  </div>
</body>
Run Code Online (Sandbox Code Playgroud)

我的完整CSS是:

* {
  margin: 0px;
  padding: 0px;
}

body {
  font-family: Calibri, Sans-Serif;
  height: 100%;
}

#header {
  width: …
Run Code Online (Sandbox Code Playgroud)

css

Jon*_*Jon
2017 05-30
72
推荐指数
6
解决办法
19万
查看次数

如何使用AngularJS模板渲染html

这是我的模板:

<div class="span12">
  <ng:view></ng:view>
</div>
Run Code Online (Sandbox Code Playgroud)

这是我的视图模板:

<h1>{{stuff.title}}</h1>

{{stuff.content}}
Run Code Online (Sandbox Code Playgroud)

我得到了contenthtml,我想在视图中显示,但我得到的只是原始的HTML代码.我该如何呈现该HTML？

javascript angularjs

use*_*147
2018 07-26
67
推荐指数
2
解决办法
12万
查看次数

服务工作者强制更新新资产

我一直在阅读html5rocks服务工作者文章简介,并创建了一个基本的服务工作者来缓存页面,JS和CSS按预期工作:

var CACHE_NAME = 'my-site-cache-v1';
var urlsToCache = [
  '/'
];

// Set the callback for the install step
self.addEventListener('install', function (event) {
  // Perform install steps
  event.waitUntil(
    caches.open(CACHE_NAME)
      .then(function(cache) {
        console.log('Opened cache');
        return cache.addAll(urlsToCache);
      })
  );
});

self.addEventListener('fetch', function (event) {
  event.respondWith(
    caches.match(event.request)
      .then(function(response) {
        // Cache hit - return response
        if (response) {
          return response;
        }

        // IMPORTANT: Clone the request. A request is a stream and
        // can only be consumed once. Since …
Run Code Online (Sandbox Code Playgroud)

service-worker

Ben*_*mas
lucky-day
36
推荐指数
3
解决办法
3万
查看次数

上传文件springboot必需的请求部分'文件'不存在

我想在我的spring启动应用程序中添加一个上传功能; 这是我的上传Rest Controller

package org.sid.web;

import java.io.BufferedOutputStream;
import java.io.File;
import java.io.FileOutputStream;
import java.io.IOException;
import java.nio.file.Files;
import java.nio.file.Path;
import java.nio.file.Paths;
import java.util.ArrayList;
import java.util.List;

import javax.servlet.ServletContext;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.HttpEntity;
import org.springframework.http.HttpHeaders;
import org.springframework.http.HttpStatus;
import org.springframework.http.MediaType;
import org.springframework.http.ResponseEntity;
import org.springframework.stereotype.Controller;
import org.springframework.util.LinkedMultiValueMap;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.client.RestTemplate;
import org.springframework.web.multipart.MultipartFile;
import org.springframework.web.servlet.mvc.support.RedirectAttributes;
import org.springframework.core.env.Environment;
import org.springframework.core.io.ClassPathResource;
import org.springframework.core.io.FileSystemResource;
import org.sid.entities.FileInfo;

@RestController
public class UploadController {
  @Autowired
  ServletContext context;

  @RequestMapping(value = "/fileupload/file", …
Run Code Online (Sandbox Code Playgroud)

upload spring-boot postman spring-restcontroller

Win*_*ern
2017 05-12
18
推荐指数
4
解决办法
4万
查看次数

Internet Explorer和剪辑路径

据我所知,剪辑路径应该在IE中工作,如许多文章和本教程CSS Masking所示

但是我无法让以下内容在IE上正常运行,但它在Chrome上运行正常.

.container {
  position: relative;
  width: 240px;
  height: 500px;
  left: 50%;
  top: 50%;
}

.pentagon {
  -webkit-clip-path: polygon(0px 0px, 100px 0px, 112px 13px, 240px 13px, 240px 250px, -250px 250px);
  -o-clip-path: polygon(0px 0px, 100px 0px, 112px 13px, 240px 13px, 240px 250px, -250px 250px);
  -ms-clip-path: polygon(0px 0px, 100px 0px, 112px 13px, 240px 13px, 240px 250px, -250px 250px);
  float: left;
}

.avatar {
  margin-top: 50px;
}

html {
  text-align: center;
  min-height: 100%;
  background: linear-gradient(white, #ddd);
}

h1,
p {
  color: …
Run Code Online (Sandbox Code Playgroud)

html css internet-explorer svg

Eri*_*ric
2018 07-10
14
推荐指数
1
解决办法
5万
查看次数

Polymer 1.0中的隐藏属性

我从0.4-0.5时代就没有使用过Polymer,而且我习惯使用隐藏属性 <my-element hidden="{{foo != bar}}"></my-element>

现在在Polymer 1.0中,我看到必须使用方法中的计算值来处理任何不是直接布尔值的值.我的代码是这样的:

<my-element hidden="{{_computeHidden()}}"></my-element>

然后在脚本部分:

Polymer({
    is: 'super-element',
    properties: {...},
    _computeHidden: function(){
         console.log('its being called, mkay');
         return !(foo == bar);
    }
});
Run Code Online (Sandbox Code Playgroud)

现在在控制台中,页面刷新后消息会出现两次,但是当foo更改值时,元素不会消失.我究竟做错了什么？

polymer polymer-1.0

naj*_*ajm
2015 08-24
9
推荐指数
2
解决办法
2万
查看次数

使用JS将JSON文件发送到Express服务器

我是JS的新手,我有一个JSON文件,我需要发送到我的服务器(Express),然后我可以解析并在我正在构建的Web应用程序中使用它的内容.

这就是我现在拥有的:

  • 一个名为data.json的JSON文件
  • 在localhost上运行的Express服务器设置

  • 一些糟糕的代码:

    app.get('/ search',function(req,res){res.header("Content-Type",'application/json'); res.send(JSON.stringify({/ data.json /})) ;});

在上面的代码中,我只是尝试将文件发送到localhost:3000/search并查看我的JSON文件,但是当我走到那条路径时我收到的是{}.谁能解释一下？

任何帮助都会非常感激.非常感谢提前.

干杯,西奥

data.json中的示例代码段:

[{
    "name": "Il Brigante",
    "rating": "5.0",
    "match": "87",
    "cuisine": "Italian",
    "imageUrl": "/image-0.png"
}, {
    "name": "Giardino Doro Ristorante",
    "rating": "5.0",
    "match": "87",
    "cuisine": "Italian",
    "imageUrl": "/image-1.png"
}]
Run Code Online (Sandbox Code Playgroud)

javascript json node.js express

The*_*uss
2017 07-01
9
推荐指数
2
解决办法
1万
查看次数

忽略服务工作者中的ajax请求

我有一个带有HTML,CSS和JS基本'shell'的应用程序.页面的主要内容是通过多个ajax调用加载到API,该API位于我的应用程序运行的另一个URL上.我已经设置了一个服务工作者来缓存应用程序的主要"shell":

var urlsToCache = [
  '/',
  'styles/main.css',
  'scripts/app.js',
  'scripts/apiService.js',
  'third_party/handlebars.min.js',
  'third_party/handlebars-intl.min.js'
];
Run Code Online (Sandbox Code Playgroud)

并在请求时响应缓存版本.我遇到的问题是我的ajax调用的响应也被缓存.我很确定我需要fetch在service-worker 的事件中添加一些代码,这些代码总是从网络中获取它们而不是查看缓存.

这是我的fetch活动:

self.addEventListener('fetch', function (event) {
    // ignore anything other than GET requests
    var request = event.request;
    if (request.method !== 'GET') {
        event.respondWith(fetch(request));
        return;
    }

    // handle other requests
    event.respondWith(
        caches.open(CACHE_NAME).then(function (cache) {
            return cache.match(event.request).then(function (response) {
                return response || fetch(event.request).then(function (response) {
                    cache.put(event.request, response.clone());
                    return response;
                });
            });
        })
    );
});
Run Code Online (Sandbox Code Playgroud)

我不确定如何忽略对API的请求.我试过这样做:

if (request.url.indexOf(myAPIUrl !== -1) {
  event.respondWith(fetch(request));
  return;
}
Run Code Online (Sandbox Code Playgroud)

但根据Chrome开发工具中的网络选项卡,所有这些响应仍然来自服务工作者.

service-worker

Ben*_*mas
lucky-day
8
推荐指数
1
解决办法
4123
查看次数

在Firestore数据库中访问存储为Object的数据

数据库结构

最近我开始测试Firebase新文档db Firestore用于学习目的,我现在卡在文档内作为对象访问值存储.

我使用下面的代码来访问Privacy存储在文档中的对象,但我不知道如何访问Key - Value？例如Key - Value,对象中有3个子对,我将如何单独访问和编辑它？

DocumentReference docRef = FirebaseFirestore.getInstance().collection("Users").document("PQ8QUHno6QdPwM89DsVTItrHGWJ3");
docRef.get().addOnCompleteListener(new OnCompleteListener<DocumentSnapshot>() {
    @Override
    public void onComplete(@NonNull Task<DocumentSnapshot> task) {
        if (task.isSuccessful()) {
            DocumentSnapshot document = task.getResult();
            if (document != null) {
                Log.d(TAG, "DocumentSnapshot data: " + task.getResult().getData().get("privacy"));
                Object meta_object = task.getResult().getData().get("privacy");
            } else {
                Log.d(TAG, "No such document");
            }
        } else {
            Log.d(TAG, "get failed with ", task.getException());
        }
    }
});
Run Code Online (Sandbox Code Playgroud)

任何帮助表示赞赏,谢谢.

android firebase google-cloud-firestore

Kum*_*vek
2017 10-23
7
推荐指数
1
解决办法
6568
查看次数

标签 统计

javascript ×3

css ×2

service-worker ×2

android ×1

angularjs ×1

express ×1

firebase ×1

google-cloud-firestore ×1

html ×1

internet-explorer ×1

json ×1

node.js ×1

polymer ×1

polymer-1.0 ×1

postman ×1

reactjs ×1

spring-boot ×1

spring-restcontroller ×1

svg ×1

upload ×1