我正在研究一个遵循这种结构的 React 项目
src |
components |
Footer |
index.jsx
styles.scss
Header |
index.jsx
styles.scss
scss |
helpers.scss
variables.scss
...
main.scss
Run Code Online (Sandbox Code Playgroud)
在我的变量文件中,我使用了css自定义变量,因此,所有这些变量都在那里:root,我可以在我的组件样式中访问它们。
当我想创建深色时,我想使用 SCSS 函数darken,但它不评估它们并抛出一个错误,说这var(--blue)不是有效颜色。
作为解决方案,我决定将所有变量移动到 SCSS 变量中,但是在构建项目时,它会引发另一个错误,指出 a$blue未定义。
我可以使用的唯一解决方案是将变量文件包含在所有样式文件中,但是,我不知道对于我正在使用的结构是否有更好的解决方案。
在我的 React 应用程序中,当我提交表单来创建新用户时,我使用fetch.
代码是这样的:
fetch('http://0.0.0.0:3000/users', {
method: 'POST',
mode: 'no-cors',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(data)
}).then(response => console.log(response))
Run Code Online (Sandbox Code Playgroud)
当我检查开发人员工具下的网络选项卡中的条目时,我看到内容类型是,text/plain但我不明白为什么如果我将其设置为application/json.
Edit and send我已尝试使用请求中的选项并替换text/plain为,application/json但在发送后,它被发送为text/plain.
我用NodeJS创建了一个应用程序,我正在使用ws模块.如果我在localhost中测试应用程序它是有效的,连接websockets没有任何问题.现在我已将应用程序上传到Openshift,当我尝试从客户端访问时,它返回无法建立与websocket的连接.
如果我在我的应用程序中使用putty尾部,我会收到以下消息:DEBUG:这种类型的响应不能有一个正文.忽略传递给end()的数据.
我在服务器中的代码是:
#!/bin/env node
//Openshift variables
var ipaddress = process.env.OPENSHIFT_NODEJS_IP || "192.168.69.42";
var port = process.env.OPENSHIFT_NODEJS_PORT || 8080;
//NodeJS require modules
var Enum = require('enum');
var WebSocketServer = require('ws').Server
wss = new WebSocketServer({host:ipaddress, port:port});
var fs = require('fs');
wss.on('connection', function(ws) {
console.log((new Date()) + ' Connection from origin: ' + ws._socket.remoteAddress);
});
console.log((new Date()) + " Server is listening on: " + ipaddress + ':' port);
Run Code Online (Sandbox Code Playgroud)
在客户端:
var ws = new WebSocket("ws://192.168.69.42:8080/");
ws.onopen = function() { …Run Code Online (Sandbox Code Playgroud) 我想知道如何验证来自a的输入值Datalist.我的意思是,如果我有一个Datalist用户可以开始写入值然后从中选择它的位置Datalist,但是用户决定不从列表中选择任何值并且他提交具有不完整值的表单,则发送值会错的.
我想过迭代所有的元素,Datalist但我认为如果Datalist有超过1.000的值并且我不知道任何其他方式来验证它,这不是一个好主意.
这是Datalist我要使用的一个例子:
<input type="text" list="colours">
<datalist id="colours">
<option value="Red" data-id="1">
<option value="Blue" data-id="2">
<option value="Green" data-id="3">
<option value="Black" data-id="4">
<option value="White" data-id="5">
</datalist>
Run Code Online (Sandbox Code Playgroud) 我正在阅读有关MDN上的函数的文章,我到达了Recursive部分,但我不明白最后一部分讨论使用类似堆栈的行为.
一个例子是:
function foo(i) {
if (i < 0)
return;
console.log('begin:' + i);
foo(i - 1);
console.log('end:' + i);
}
foo(3);
// Output:
// begin:3
// begin:2
// begin:1
// begin:0
// end:0
// end:1
// end:2
// end:3
Run Code Online (Sandbox Code Playgroud)
在该功能上,我了解何时显示begin日志,但是当显示end日志时我不知道.有人可以帮我解释一下吗?
我正在尝试制作一个可在移动设备中水平滚动的导航菜单.要做到这一点,我想使用它flexbox,但当我设置移动视图时,导航项的宽度减少.
我尝试使用flex-grow和flex-basis性能将它们设置为1与0分别,但没有奏效.
在这种情况下,我使用导航部分的虚拟名称,但它们可以具有不同的长度.
ul {
display: flex;
margin: 0;
padding: 0;
list-style: none;
background-color: #f2f2f2;
overflow-y: hidden;
overflow-x: auto;
}
li {
flex-grow: 1;
flex-basis: 0;
margin-left: 10px;
}Run Code Online (Sandbox Code Playgroud)
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
<li>Item 5</li>
</ul>Run Code Online (Sandbox Code Playgroud)
我正在尝试从node js图像创建一个容器,并且我已经配置了我的Dockerfile如下所示:
FROM node:boron
# Create app directory
RUN mkdir -p /usr/src/app
WORKDIR /usr/src/app
# Install app dependencies
COPY package.json /usr/src/app
RUN npm install
# Bundle app source
COPY . /usr/src/app
VOLUME ./:/usr/src/app
ENTRYPOINT [ "npm run watch" ]
Run Code Online (Sandbox Code Playgroud)
在package.json我有一个名为watchthan的脚本中运行名为watch-less.
如果我npm run watch在本地环境中运行该命令,但当我尝试运行容器时,它不会运行并显示下一个错误:
docker: 来自守护进程的错误响应:oci 运行时错误:container_linux.go:247:启动容器进程导致“exec:\”npm run watch\”:在 $PATH 中找不到可执行文件”。
我正在使用此插件来设置网格库.此图库显示X个图像.ajax调用后,这些图像被加载到HTML中:
$.ajax({
type:"POST",
dataType:"html",
contentType:"application/x-www-form-urlencoded",
url:url,
data:data,
success:function(response) {
$("#masonry-container").html('<div id="content">'+response+'</div>');
initialiceMasonry();
}
,timeout:10000
});
Run Code Online (Sandbox Code Playgroud)
如您所见,在附加它调用的服务器响应之后 initialiceMasonry();
var container = $("#content");
container.masonry({
columnWidth:190,
itemSelector:".item",
gutter:8,
});
Run Code Online (Sandbox Code Playgroud)
在初始化之后,图像显示重叠,寻找关于此插件的另一个问题我找到了使用的选项,imagesLoaded但它返回给我这个错误:
Uncaught TypeError: undefined is not a function
Run Code Online (Sandbox Code Playgroud)
并选择我呼叫的线路 imagesLoaded
从服务器我得到这个HTML:
<div class="item" data-id="160">
<img src="image_1.jpeg" />
<div class="options">
<h4>Section 1</h4>
<a href="section_1.php">Section 1</a>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
如何正确初始化砌体以修复重叠问题?