vue-esign 如何设定百分百的样式

Vue-Esign是一个用于在线设计、编辑和签署文档的库，它通常与Vue.js框架集成，提供了一个基于HTML5 canvas的富文本编辑器。若要在Vue-Esign中设置元素达到100%宽度，你需要确保应用了正确的CSS样式，并理解如何作用于canvas容器及其内容。

以下是基本步骤：

1. 首先，你需要获取到包含编辑区的`<canvas>`元素。这通常是在组件的模板中创建的，例如：

<template>
  <div class="esign-container">
    <canvas ref="editorCanvas"></canvas>
  </div>
</template>

2. 使用Vue的`ref`属性绑定了一个引用，然后在你的JavaScript中可以操作这个引用：

<script>
export default {
  setup() {
    const editorCanvas = ref(null);
    //...
  },
  mounted() {
    if (editorCanvas.value) {
      //...
    }
  },
}
</script>

3. 接下来，通过JavaScript或CSS将`canvas`的宽度设置为100%，使其适应其容器。你可以直接在CSS里添加如下样式：

.esign-container {
  position: relative;
}

.esign-container canvas {
  width: 100%;
  height: auto; /* 如果你也想让高度自适应，去掉这行或者改为height: 100%; */
}

如果你需要设置某个特定元素（比如一个文本框或图片）也占满容器宽度，可以在对应的编辑API上调用类似`setWidth`的方法并传入`100%`作为参数。