图表的日期范围

时间:2018-12-03 16:49:18

标签: javascript vue.js vuex

我正在尝试从日期时间组件中获取startDate和endDate,并针对图表运行它:以["2018-11-29T20:41:28.449Z","3"]格式保存vuex存储中值数组的数据是返回a的最佳方法计算属性?

  <template>
    <div class="b-container">
        <br />
        <h2>Probe Charts</h2>
        <ul v-for="(photon,key) in this.$store.state.photons">
            <h3>Photon: {{key}}</h3>
            <b-row>
                <b-col>
                    <datetime type='datetime' v-model="photon.startDate" use12-hour auto class="theme-orange">
                        <label for="startDate" slot="before" placeholder="">Start Datetime:</label>
                    </datetime>
                </b-col>
                <b-col>
                    <datetime type="datetime" min-datetime="2018-12-2" use12-hour auto v-model="photon.endDate" class="theme-orange">
                        <label for="endDate" slot="before" placeholder="">End Datetime:</label>
                    </datetime>
                </b-col>
            </b-row>
            <line-chart :data="photon.data.rbChannel" :key="photon.id" ytitle="R/B Channel" height="220px"></line-chart>
            <line-chart :data="photon.data.tempF" :key="photon.id" ytitle="Temperature F" :colors="['#ff0000']" height="220px"></line-chart>
            <line-chart :data="photon.data.srm" :key="photon.id" ytitle="SRM" :colors="['#ffa500']" height="220px"></line-chart>
            <line-chart :data="photon.data.turbidParticle" :key="photon.id" ytitle="Turbid Particle" :colors="['#000000']"
                height="220px"></line-chart>
        </ul>
    </div>

</template>

<script>
    export default {
        name: 'probeDiagnostics',
        data() {
            return {
                startDate: '',
                endDate: ''
            }
        },
        mounted() {},
        methods: {

        },

        computed:{
            datePickChart: function(){
                return this.$store.state.photons
            }
        }
    }
</script>

0 个答案:

没有答案