Веб-компонент Lightning для отображения строки JSON не работает

У меня есть следующий веб-компонент Lightning для чтения строки JSON и отображения их на странице сведений о контактной записи. Обратите внимание, что я новичок в освещении веб-компонентов и прилагаю значительные усилия для обучения.

МойКомпонент.html


<template>
  <lightning-record-form
        object-api-name = {contactObject}
        fields = {myFields}
        onsuccess = {handleContactCreated} onload = {handleContactInitialized} >
  </lightning-record-form>
</template>

MyComponent.js


 import { LightningElement, wire, track } from 'lwc';
 import findDetails from 
        '@salesforce/apex/JSONDemoController.getContactWithRelatedDataById';
 import CONTACT_OBJECT from '@salesforce/schema/Contact';
 import NAME_FIELD from '@salesforce/schema/Contact.Name';
 import TEST_FIELD from '@salesforce/schema/Contact.TestField__c';
 import SPOUSE_FIELD from '@salesforce/apex/ResponseJSONWrapper.spouse';
 import ADDRESS_FIELD from 
    '@salesforce/apex/ResponseJSONWrapper.mailingAddress';


export default class ContactCreator extends LightningElement {

contactObject = CONTACT_OBJECT;

myFields = [SPOUSE_FIELD,ADDRESS_FIELD];
@track contacts;
@track error;

handleContactCreated(){
    // Run code when account is created.
}

handleContactInitialized(){
  findDetails()
      .then(result => {
          var responseObj = JSON.parse(result.getReturnValue());
          this.SPOUSE_FIELD = responseObj.spouse;
          this.ADDRESS_FIELD = responseObj.mailingAddress;
      })
      .catch(error => {
          this.error = error;
      });
      myFields = [SPOUSE_FIELD,ADDRESS_FIELD];
    }
 }

JSONDemoController.cls


public class JSONDemoController {
   @AuraEnabled
   public static String getContactWithRelatedDataById() {

    String response = '';
    ResponseJSONWrapper wrapper = new ResponseJSONWrapper();
    wrapper.spouse = 'Test Spouse';
    wrapper.mailingAddress = 'Test Address';
    response = JSON.serialize(wrapper);
    return response;
}

}

ОтветJSONWrapper.cls


  public with sharing class ResponseJSONWrapper {
     public String spouse;
     public String contactRecordType;
     public Date birthDate;
     public String mobile;
     public String mailingAddress;
     public String otherAddress;
     public String languages;
     public String level;
     public String Description;
}

Но я не получаю значения, которые я жестко запрограммировал в компоненте молнии, когда он отображается. Там ничего нет, он пустой. Может ли кто-нибудь помочь указать, где я ошибаюсь?

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
0
6 211
2

Ответы 2

Измените эту строку:

var responseObj = JSON.parse(result.getReturnValue());

Кому:

var responseObj = JSON.parse(result);

getReturnValue() предназначен для компонентов Aura.

На самом деле вам не нужно сериализовать оболочку в apex, а затем явно анализировать компонент, фреймворк делает эту работу сам!

public class JSONDemoController {
   @AuraEnabled   //change return type to ResponseJSONWrapper 
   public static ResponseJSONWrapper getContactWithRelatedDataById() {

    String response = '';
    ResponseJSONWrapper wrapper = new ResponseJSONWrapper();
    wrapper.spouse = 'Test Spouse';
    wrapper.mailingAddress = 'Test Address';
    return wrapper;   //return the wrapper itself
}

и в .js файле

findDetails()
  .then(result => {
      var responseObj = result;
      ...
  })

Таким образом, код будет менее загроможден ненужным кодом :)

Другие вопросы по теме