如何将从Firebase检索的单个JSON记录转换为数组

时间:2018-06-21 18:20:07

标签: firebase vuejs2 axios

我正在尝试从firebase中获取一条记录,以便在vuejs中使用,但是即使那是我应该做的事情,我也无法找到如何将其转换为数组的方法。

我的突变

GET_CASE(state, caseId) {
  state.caseId = caseId;
},

我的动作

getCase ({ commit, context }, data) {
  return axios.get('http' + data + '.json')
  .then(res => {
    const convertcase = []
      convertcase.push({ data: res.data })
    //result below of what is returned from the res.data
    console.log(convertcase)
   // commit('GET_CASE', convertcase)
  })
  .catch(e => context.error(e));
},

我现在将以下内容返回到{{myCase}}

[ { "data": { case_name: "Broken laptop", case_status: "live", case_summary: "This is some summary content", contact: "", createdBy: "Paul", createdDate: "2018-06-21T15:20:22.932Z", assessor: "Gould", updates: "" } } ] 

当我要显示的是“笔记本电脑破损”时

谢谢

3 个答案:

答案 0 :(得分:0)

将其放在.then

内/之后
    Object.keys(data).forEach(function(k, i) {
        console.log(k, i);
    });

答案 1 :(得分:0)

通过Axios的回复,您可以将数据获取为:

res.data.case_name
res.data.case_number
....

只需构建包含这些属性的JavaScript对象,然后将此对象传递给您的突变即可。我认为这比使用数组更好。

const obj = {};
Object.assign(obj, res.data);
commit('GET_CASE', obj)

在您的突变中,您将执行以下操作:

mutations: {
  GET_CASE (state, payload) {
    for (var k in payload) {
        if (payload.hasOwnProperty(k)) {
            state[k] = payload[k]
        }
    }
  }
}

或者,您可以按照以下方式对商店进行编码:

state: {
    case: {},
    ...
},
getters: {
    getCase: state => {
       return state.case
    },
....
},
mutations: {
  GET_CASE (state, payload) {
    state.case = payload
  }
}

,您将通过一个组件调用case字段的值,如下所示:

const case = this.$store.getters.getCase
..... = case.case_name

答案 2 :(得分:0)

示例let obj = {a: 1, b: 'a'); let arr = Object.values(obj) // arr = [1, 'a']

async getCase ({ commit, context }, url) {
  try {
    let { data } = await axios.get(`http${url}.json`)
    commit('myMutation', Object.values(data))
  } catch (error) {
    context.error(error)
  }
}

但是,当我再次阅读您的文章时,我认为您不需要对象数组。您需要一个对象的数组。所以,也许这就是您想要的:

async getCase ({ commit, context }, url) {
  try {
    let { data } = await axios.get(`http${url}.json`)
    commit('myMutation', [data])
  } catch (error) {
    context.error(error)
  }
}