質問編集履歴
1
コード
test
CHANGED
File without changes
|
test
CHANGED
@@ -6,7 +6,7 @@
|
|
6
6
|
|
7
7
|
下記はデモです。
|
8
8
|
|
9
|
-
[デモ(CodeSandBox)](https://codesandbox.io/s/
|
9
|
+
[デモ(CodeSandBox)](https://codesandbox.io/s/cool-microservice-e8vto?fontsize=14&hidenavigation=1&theme=dark)
|
10
10
|
|
11
11
|
音楽ファイルを読み込むと、音楽の総再生時間を表示します。
|
12
12
|
|
@@ -120,6 +120,8 @@
|
|
120
120
|
|
121
121
|
sampleSource.disconnect();
|
122
122
|
|
123
|
+
setCurrent(0);
|
124
|
+
|
123
125
|
setPlaying(false);
|
124
126
|
|
125
127
|
};
|
@@ -128,7 +130,11 @@
|
|
128
130
|
|
129
131
|
const changeSeek = (e) => {
|
130
132
|
|
133
|
+
setCurrent(e.target.value);
|
134
|
+
|
135
|
+
audioCtx.currentTime = current;
|
136
|
+
|
131
|
-
console.log(audioCtx.
|
137
|
+
console.log(audioCtx.currentTime);
|
132
138
|
|
133
139
|
};
|
134
140
|
|
@@ -136,7 +142,7 @@
|
|
136
142
|
|
137
143
|
return (
|
138
144
|
|
139
|
-
<
|
145
|
+
<>
|
140
146
|
|
141
147
|
<p>曲の長さ {total}</p>
|
142
148
|
|
@@ -152,7 +158,7 @@
|
|
152
158
|
|
153
159
|
onChange={changeSeek}
|
154
160
|
|
155
|
-
|
161
|
+
value={current}
|
156
162
|
|
157
163
|
type="range"
|
158
164
|
|
@@ -162,12 +168,20 @@
|
|
162
168
|
|
163
169
|
/>
|
164
170
|
|
165
|
-
</
|
171
|
+
</>
|
166
172
|
|
167
173
|
);
|
168
174
|
|
169
175
|
};
|
170
176
|
|
177
|
+
|
178
|
+
|
179
|
+
const inputStyle = {
|
180
|
+
|
181
|
+
width: "100%"
|
182
|
+
|
183
|
+
};
|
184
|
+
|
171
185
|
```
|
172
186
|
|
173
187
|
|