Вопросы Теги

Свойство или метод * не определен. Ошибка при рендеринге

Исходя из существующих ответов на этот пост, это упрощает реализацию:) 

namespace System
{
    public static class BaseTypesExtensions
    {
        /// <summary>
        /// Just a simple wrapper to simplify the process of splitting a string using another string as a separator
        /// </summary>
        /// <param name="s"></param>
        /// <param name="pattern"></param>
        /// <returns></returns>
        public static string[] Split(this string s, string separator)
        {
            return s.Split(new string[] { separator }, StringSplitOptions.None);
        }


    }
}
0
задан agrm 13 July 2018 в 21:28
поделиться

2 ответа

Если вы используете однокомпонентный компонент Vue, это означает, что vue-loader ожидает, что содержимое тега <template> станет определением шаблона компонента и содержимым тега <script> для экспорта объект конфигурации, используемый при создании экземпляра Vue.

В настоящее время ваш <template> содержит правильное определение шаблона, но ваш <script> ничего не экспортирует. Поэтому, когда экземпляр Vue создается на основе содержимого этого файла, он не знает, где найти свойство tables, на которое ссылаются в шаблоне.

Кажется, вы пытаетесь установить Vue для элемента в определении шаблона. Но вы должны просто экспортировать свой объект конфигурации экземпляра Vue: 

<template>
  <div >
    <input type='button' @click='allRecords()' value='Select All users'>
    <b-table striped hover responsive id="tabla_final" >
      <tr v-for='table in tables'>
        <td>{{ table.sum_real }}</td>
        <td>{{ table.sum_ppto }}</td>
        <td>{{ table.sum_real }}</td>
      </tr>
    </b-table>
  </div>
</template>

<script>
import Vue from 'vue'
const axios = require('axios')

export default {
  data() {
    return { tables: '' }
  },
  methods: {
    allRecords: function () {
      let self = this;
      axios.get('http://localhost/Tribeca/api.php')
        .then(function (response) {
          self.tables = response.data
          console.log(response.data)
        })
        .catch(function (error) {
          console.log(error)
        })
      }
    }
  })
}
</script>

Обратите внимание, что вам также нужно будет сделать функцию data, которая возвращает объект, и правильно ссылаться на данные tables свойство в обратном вызове then вызова axios.

2
ответ дан thanksd 17 August 2018 в 12:11
поделиться

Изменить: 

app.tables = response.data

To 

this.tables = response.data

Всякий раз, когда вы хотите ссылаться на свойство внутри данных -tables в этом случае, используйте this.nameOfProperty.

0
ответ дан Richard-MX 17 August 2018 в 12:11
поделиться
  • 1
    idk, почему OP создает отдельный экземпляр Vue, установленный в app, но в этом случае this не будет ссылаться на экземпляр Vue, но область действия функции в обратном вызове then, поэтому установка this.tables не будет обновите свойство данных экземпляра tables. Вам нужно будет ссылаться на app.tables. Это также не то, что вызывает проблему. – thanksd 13 July 2018 в 20:07
  • 2
    Да, я согласен с тобой. Он говорит, что он новичок в Vue, поэтому я думаю, что мы оба правы. Он должен экспортировать компонент так же, как и в вашем ответе, а затем ему нужно фактически обновить свойство tables, как я писал. Приветствия. – Richard-MX 13 July 2018 в 20:12
  • 3
    Благодаря обоим! Я новичок в VUE, есть чему поучиться. – Nicolás Riderelli 13 July 2018 в 21:32
Другие вопросы по тегам:

Похожие вопросы: