dummy data 이용하여 음악 재생 테스트

src/components/Player.js

@@ -163,7 +163,7 @@ export default props => {
   const destination = tabY - minHeight - statusBarHeight;
   const [currentPlayerValue, setCurrentPlayerValue] = useState(0);
   const [isPlay, setPlay] = useState(false);
-
+  const {playerData} = props.Pages;
   const {
     onGestureEvent,
     translateY,
@@ -301,11 +301,11 @@ export default props => {
   }, []);
 
   useEffect(() => {
-    
+    playerDispatch({type:'currentTime', setCurrentTime: 0});
     return () => {
       playerDispatch({type:'currentTime', setCurrentTime: 0});
     };
-  },[]);
+  },[playerData.soundURI]);
 
   const slideUp = () => {};
 
@@ -430,7 +430,7 @@ export default props => {
                     source={props.Pages.img}
                     />
                   <Video
-                    source={{uri:uri}}
+                    source={{uri:playerData.soundURI}}
                     style={StyleSheet.absoluteFill}
                     ref={player}
                     //rate={this.state.rate}
@@ -485,15 +485,15 @@ export default props => {
           >
             <C.View cls="w90 h100 bgc-rgba-black-0_5">
               <ScrollView style={{ flex: 1, marginTop: '10%' }}>
-                <C.Text cls="flx1 ta-c">{props.Pages.subtitle}</C.Text>
+                <C.Text cls="flx1 fw-b ta-c">{playerData.title}</C.Text>
                 <C.View cls="flx2 ph5 mt5">
-                  <C.Text cls="fw-b">{props.Pages.subtitle}</C.Text>
-                  <C.Text cls="mt2">{props.Pages.contens}</C.Text>
+                  <C.Text cls="fw-b">{playerData.subtitle}</C.Text>
+                  <C.Text cls="mt2">{playerData.contents}</C.Text>
                   <C.Text cls="mt3" numberOfLines={1}>
-                    by {props.Pages.subtitle.replace(/\r\n|\n|\r/gm, ' ')}
+                    by {playerData.author.replace(/\r\n|\n|\r/gm, ' ')}
                   </C.Text>
                   <C.Text cls="mt5 as-e" numberOfLines={1}>
-                    March 19
+                    {playerData.date}
                   </C.Text>
                 </C.View>
               </ScrollView>

src/components/PlayerContents.js

@@ -12,6 +12,7 @@ export default props => {
   const playerState = useContext(PlayerStateContext);
   const {paused, player, duration, currentTime} = playerState;
   const { secondsTohhmmss } = playerCommon;
+  const {playerData} = Pages;
   const onSetPlay = () => {
     //setPlay(!isPlay);
     playerDispatch({type:'paused', setPaused:!paused});
@@ -36,17 +37,17 @@ export default props => {
   }
   return (
     <ScrollView>
-      <C.Text cls="flx1 ta-c">{Pages.subtitle}</C.Text>
+      <C.Text cls="flx1 ta-c">{playerData.title}</C.Text>
       <C.View cls="flx2 ph5 mt5">
-        <C.Text cls="fw-b">{Pages.subtitle}</C.Text>
+        <C.Text cls="fw-b">{playerData.subtitle}</C.Text>
         <C.Text cls="mt2" numberOfLines={10}>
-          {Pages.contens}
+          {playerData.contents}
         </C.Text>
         <C.Text cls="mt3" numberOfLines={1}>
-          by {Pages.subtitle.replace(/\r\n|\n|\r/gm, ' ')}
+          by {playerData.author.replace(/\r\n|\n|\r/gm, ' ')}
         </C.Text>
         <C.Text cls="mt5 as-e" numberOfLines={1}>
-          March 19
+          {playerData.date}
         </C.Text>
       </C.View>
       <C.View cls="flx1 flx-row jc-sa ai-c mt5">

src/components/PlayerControls.js

@@ -23,6 +23,7 @@ export default PlayerControls = props => {
   const playerState = useContext(PlayerStateContext);
   const {paused, player, duration, currentTime} = playerState;
   const { secondsTohhmmss } = playerCommon;
+  const {playerData} = Pages;
 
   const onSetPlay = () => {
     //setPlay(!isPlay);
@@ -44,7 +45,7 @@ export default PlayerControls = props => {
         <View style={styles.placeholder} />
         <C.View cls="flx2">
           <C.View cls="flx-row jc-sb">
-            <Text numerOfLine={1}>{Pages.subtitle.replace(/\r\n|\n|\r/gm,' ')}</Text>
+            <Text numerOfLine={1}>{playerData.title.replace(/\r\n|\n|\r/gm,' ')}</Text>
             <Text>{secondsTohhmmss(duration)}</Text>
           </C.View>
           <Slider