soc_web/src/components/common/textarea.vue

<template>
  <div class="k-textarea">
    <el-input
      type="textarea"
      :autosize="{minRows: 4}"
      v-model="pv"
      :maxlength="length"
      :placeholder="placeholder"
    ></el-input>
    <div class="k-textarea__length">{{pv ? pv.length : 0}} / {{length}}</div>
  </div>
</template>
<script>
import sync from "../utils/computed.sync";
export default {
  data() {
    return {};
  },
  computed: {
    pv: sync("value")
  },
  watch: {},
  props: {
    value: {},
    length: {},
    placeholder: {}
  },
  methods: {},
  mounted() {}
};
</script>
<style lang="scss">
.k-textarea {
  position: relative;
  &__length {
    position: absolute;
    bottom: 0;
    right: 12px;
    font-size: 12px;
  }
}
</style>