Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
React in lightening/aura salesforce dev mode
<aura:component implements="flexipage:availableForAllPageTypes" access="global" controller="Controller">
<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
<div aura:id="container"/>
</aura:component>
public with sharing class Controller {
@AuraEnabled
public static List<Contact> findAll() {
return [SELECT Id, Name from Contact limit 20];
}
}
({
doInit: function(component) {
function loadScript(url, callback)
{
var head = document.getElementsByTagName('head')[0];
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = url;
script.addEventListener('load', callback)
head.appendChild(script);
}
loadScript('https://localhost' + ':8080/search.bundle.js', function() {
var container = component.find("container").getElement();
ReactSearch.init(component, container);
});
}
})
import React from 'react';
import { render } from 'react-dom';
window.ReactSearch = {
init: function init(component, el, service) {
var action = component.get("c.findAll");
action.setCallback(this, function(a) {
var contacts = a.getReturnValue();
console.log(contacts);
});
$A.enqueueAction(action, false);
render((
<div>123</div>
), el);
}
};
@ButuzGOL

This comment has been minimized.

Copy link
Owner Author

commented May 27, 2017

  1. Also you need to install https://chrome.google.com/webstore/detail/disable-content-security/ieelmcmcagommplceebfedjlakkhpden
  2. and in webpack config
devServer: {
        headers: {
            'Access-Control-Allow-Origin': '*'
        }
    },
@ButuzGOL

This comment has been minimized.

Copy link
Owner Author

commented May 29, 2017

This way also works

<ltng:require scripts="https://localhost:8080/search.bundle.js"
                  afterScriptsLoaded="{!c.cmpInit}"/>
    
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.