在UniApp中动态画线连接两个坐标点，可以通过使用canvas组件来实现。canvas是一个画布组件，允许你通过编程绘制图形，包括线条、矩形、圆形等。以下是一个基本的步骤和示例代码，展示如何在UniApp中使用canvas组件动态画线：

步骤1：在页面中添加canvas组件

首先，在页面的.vue文件中添加canvas组件，并为其设置一个唯一的canvas-id属性，这个属性将用于后续的绘图操作。

<template>
  <view>
    <canvas canvas-id="myCanvas" style="width: 300px; height: 300px;"></canvas>
  </view>
</template>

步骤2：在script中编写绘制线条的逻辑

在页面的script部分，使用uni.createCanvasContext方法创建一个canvas的绘图上下文，然后使用moveTo和lineTo方法来指定线条的起点和终点坐标。最后，调用stroke方法来绘制线条。

<script>
export default {
  mounted() {
    this.drawLine();
  },
  methods: {
    drawLine() {
      // 创建canvas绘图上下文
      const context = uni.createCanvasContext('myCanvas', this);
      
      // 设置线条的起点坐标
      context.moveTo(10, 10); // 假设这是第一个坐标点
      
      // 设置线条的终点坐标
      context.lineTo(290, 290); // 假设这是第二个坐标点
      
      // 绘制线条
      context.stroke();
      
      // 将以上绘制的内容显示在canvas上
      context.draw();
    }
  }
}
</script>

在这个示例中，moveTo(10, 10)设置了线条的起点坐标为(10, 10)，lineTo(290, 290)设置了线条的终点坐标为(290, 290)。通过调整这些坐标值，你可以根据需要绘制不同位置和长度的线条。

注意事项

• 确保在页面加载完成后（例如在mounted生命周期钩子中）调用绘制线条的方法，以确保canvas组件已经被正确加载和初始化。
• canvas-id属性值需要唯一，以区分页面上的不同canvas组件。

通过以上步骤，你可以在UniApp中动态地画线连接两个坐标点。