upd: barrage demo 优化

src/packages/__VUE/barrage/demo.vue

@@ -5,7 +5,9 @@
       <nut-barrage ref="danmu" :danmu="list"></nut-barrage>
     </nut-cell>
     <div class="test">
-      <button @click="addDanmu" class="add">随机添加</button>
+      <button @click="addDanmu" class="add nut-button--primary"
+        >随机添加</button
+      >
     </div>
   </div>
 </template>
@@ -47,17 +49,13 @@ export default createDemo({
   padding: 20px 0;
   height: 150px;
 }
-#app .demo {
-  background: #fff;
-}
+
 .test {
   .add {
     display: block;
     padding: 5px 30px;
     margin: 20px auto;
     border-radius: 15px;
-    background: #949494;
-    color: white;
     font-size: 12px;
   }
 }

src/packages/__VUE/barrage/index.taro.vue

@@ -123,7 +123,7 @@ export default create({
           .boundingClientRect((rec) => {
             let danmuCWidth = rec.width;
             // let width = domList[_index]['width'];
-            let height = domList[_index]['height'];
+            let height = domList[_index]?.height || 0;
             el.classList.add('move');
             el.style.animationDuration = `${speeds}ms`;
             el.style.top =

src/sites/mobile-taro/vue/src/business/pages/barrage/index.vue

@@ -5,8 +5,9 @@
       <nut-barrage ref="danmu" :danmu="list"></nut-barrage>
     </nut-cell>
     <div class="test">
-      <nut-input label="文本" v-model="inputVal" />
-      <nut-button shape type="primary" @click="addDanmu">添加</nut-button>
+      <button @click="addDanmu" class="add nut-button--primary"
+        >随机添加</button
+      >
     </div>
   </div>
 </template>
@@ -27,7 +28,8 @@ export default {
       '爷青结'
     ]);
     function addDanmu() {
-      danmu.value.add(inputVal.value);
+      let n = Math.random();
+      danmu.value.add('随机——' + String(n).substr(2, 10));
     }
     return {
       inputVal,
@@ -43,13 +45,16 @@ export default {
 .nut-cell,
 .nut-barrage {
   padding: 20px 0;
-  height: 120px;
+  height: 150px;
 }
+
 .test {
-  display: flex;
-  justify-content: space-between;
-  .nut-input {
-    width: 80%;
+  .add {
+    display: block;
+    padding: 5px 30px;
+    margin: 20px auto;
+    border-radius: 15px;
+    font-size: 12px;
   }
 }
 </style>