我想用文本内容flexbox收集所有li并减少第二秒的总时间并将其返回.我做到了,但是如何将代码重写为单个reduce函数.结果应该是以秒为单位的数据时间总和
HTML
<li data-time="3:07">Flexbox Video</li>
<li data-time="5:59">Redux Video</li>
...
Run Code Online (Sandbox Code Playgroud)
JS
const listItems = [...document.querySelectorAll('li')];
const flexBoxItem = listItems
.filter(item => item.textContent.includes('Flexbox'))
.map(item => item.dataset.time)
.map(item => {
let parts = item.split(':').map(i => parseFloat(i))
return (parts[0] * 60) + parts[1]
})
.reduce((prev, next) => prev + next, 0)
Run Code Online (Sandbox Code Playgroud) 我有100个索引的数组
const randomArr = [...Array(100).keys()]
Run Code Online (Sandbox Code Playgroud)
如何像这样返回100个数组
[{index: i}, {title: `title${i}`}]
Run Code Online (Sandbox Code Playgroud)
其中i应该是随机的数组的索引.
如何在webpcak 4中将loader用于mp4视频格式,我尝试这样:
{
test: /\.mp4$/,
use: 'file-loader',
loader: 'file-loader?name=videos/[name].[ext]',
},
Run Code Online (Sandbox Code Playgroud)
然后像这样导入
import pressButtonAnimated from './images/pressButtonAnimated.mp4'
Run Code Online (Sandbox Code Playgroud)
但这对我不起作用,并且出现错误 You may need an appropriate loader to handle this file type.
但这是对我有用的,但我不想在每个文件中添加
import pressButtonAnimated from '-!file-loader!./images/pressButtonAnimated.mp4'
Run Code Online (Sandbox Code Playgroud) 我试图用nth-of-type设置每隔一个灰色的背景.time和.title元素(奇/偶模式).
<div class="calendar">
<div class="time">Gray Background</div>
<div class="title">Gray Background</div>
<div class="time">White Background</div>
<div class="title">White Background</div>
<div class="time">Gray BG</div>
<div class="title">Gray BG</div>
<div class="time">White Background </div>
<div class="title">White Background</div>
</div>
Run Code Online (Sandbox Code Playgroud) 我尝试将新图标添加到selection.json中,我下载了新的json文件,并在其中添加了该图标。但是它们在index.html中不可见。我没有看到facebook和goole +图标。selection.json自动更新了我的iconmoon.svf文件。我的selection.json代码。
{
"IcoMoonType": "selection",
"icons": [
{
"icon": {
"paths": [
"M325.8 457.4v111.8h184.8c-7.4 48-55.8 140.6-184.8 140.6-111.2 0-202-92.2-202-205.8s90.8-205.8 202-205.8c63.4 0 105.6 27 129.8 50.2l88.4-85.2c-56.8-53-130.4-85.2-218.2-85.2-180.2 0.2-325.8 145.8-325.8 326s145.6 325.8 325.8 325.8c188 0 312.8-132.2 312.8-318.4 0-21.4-2.4-37.8-5.2-54h-307.6z",
"M1024 448h-96v-96h-96v96h-96v96h96v96h96v-96h96z"
],
"attrs": [
{"fill": "rgb(53, 78, 90)"}
],
"isMulticolor": false,
"isMulticolor2": false,
"tags": [
"icon-google-plus"
],
"grid": 16
},
"attrs": [
{"fill": "rgb(53, 78, 90)"}
],
"properties": {
"order": 68,
"id": 2,
"name": "google-plus",
"prevSize": 32
},
"setIdx": 0,
"setId": 2,
"iconIdx": 0
}, …Run Code Online (Sandbox Code Playgroud)我尝试用扩展语法编写三元运算符并复制两个对象.是否可以在文字对象中使用带有扩展语法的三元运算符?我的代码工作正常,我只想优化它.
hintStyle: disabled ? {...globalStyles.hint, ...globalStyles.hintDisabled} : globalStyles.hint,
Run Code Online (Sandbox Code Playgroud)
我想这样写:
hintStyle: {...globalStyles.hint, {disabled ? ...globalStyles.hintDisabled : {}}},
Run Code Online (Sandbox Code Playgroud) 为什么当我在test id中编写'new ServerNotificationApi'时不会调用构造函数,因为我new ServerNotificationApi.constructor()工作,但我无法理解为什么当我写 new ServerNotificationApi单元测试时出现错误'TypeError:_serverNotifications.default不是构造函数'
类
class ServerNotificationApi {
constructor() {
SignalR.initConnection(url.serverNotificationHubName)
}
subscribe = callback => SignalR.subscribe(url.entityChanged, url.serverNotificationHubName, callback);
unsubscribe = callback => SignalR.unsubscribe(url.entityChanged, url.serverNotificationHubName, callback);
}
export default new ServerNotificationApi()
Run Code Online (Sandbox Code Playgroud)
测试
it('constructor should call signalR method \'initConnection\'', () => {
sinon.stub(SignalR, 'initConnection')
new ServerNotificationApi.constructor()
SignalR.initConnection.calledWith(url.serverNotificationHubName).should.be.true
SignalR.initConnection.restore()
})
Run Code Online (Sandbox Code Playgroud) 我有一个脚本,
"build": "rimraf dist webpack --progress --config webpack/prod.js",
但是实际上,它不是删除dist而是删除webpack文件夹中的所有文件。但是我只需要删除dist
Structure:
-dist
-webpack
-somefiles.js
Run Code Online (Sandbox Code Playgroud) javascript ×5
ecmascript-6 ×3
arrays ×2
html ×2
webpack ×2
css ×1
css3 ×1
enzyme ×1
fonts ×1
json ×1
loops ×1
node.js ×1
npm ×1
package.json ×1
reduce ×1
svg ×1
unit-testing ×1
webpack-4 ×1