vue 구성 요소의 데이터를 편집할 때 입력 유형 날짜의 값을 표시하는 방법은?

vue 구성 요소의 데이터를 편집할 때 입력 유형 날짜의 값을 표시하는 방법은?

다음과 같은 내 vue 구성 요소:

<template>
    <section>
        ...
        <form-input id="total-sold" name="total-sold" :value="products.total_sold">Total Sold</form-input>
        <form-input id="created-at" type="date" name="created-at" :value="products.created_at">Created At</form-input>
    </section>
</template>

<script>
    export default {
        props: ['products'],
        mounted() {
            console.log(this.products.total_sold) // The result : 46
            console.log(this.products.created_at) // The result : 2018-02-26 09:03:03
        },
    }
</script>

다음과 같은 폼 입력 구성 요소 vue:

<template>
    <div class="form-group">
        <label :for="id" class="control-label" :class="classLabel"><slot></slot></label>
        <input :type="type" :name="name" :id="id" class="form-control" :placeholder="dataPlaceholder" :disabled="disabled" :value="value">
    </div>
</template>

<script>
    export default {
        name: "form-input",
        props: {
            'id': String,
            'name': String,
            'type': {
                type: String,
                default: 'text'
            },
            'disabled': String,
            'dataPlaceholder': {
                type: String,
                default() {
                    return this.$slots.default ? this.$slots.default[0].text : ''
                }
            },
            'value': {
                type: [String, Number]
            }
        },
        data(){
            return {
                classLabel: {'sr-only': !this.$slots.default}
            }
        }
    }
</script>

첫 번째 구성 요소 vue에서는 폼 입력 구성 요소 vue를 호출할 겁니다.나는 부품을 그렇게 만든다.그래서 나중에 구성요소를 반복해서 사용할 수 있다.

구성 요소가 실행된 경우, 판매된 총량의 입력 텍스트가 데이터를 표시한다.결과는 46.그러나 에서 만든 입력 텍스트는 표시 데이터가 아니다.타입이 날짜라서 그런 것 같다.

어떻게 하면 이 문제를 해결할 수 있을까?

<input type="date">의 형태로 가치를 기대하다YYYY-MM-DD, MDN을 참조하십시오. 잘못된 형식의 값을 지정하려는 경우:2018-02-26 09:03:03시간 스탬프를 포함하는.

래퍼 입력 구성 요소를 생성하거나<input>다음과 같은 형식의 값을 예상하는 시간 타임스탬프를 지원하는 기능:yyyy-MM-ddThh:mm.

참조URL: https://stackoverflow.com/questions/48993333/how-can-i-display-value-of-input-type-date-when-edit-data-on-vue-component