javascript - importar - ¿Cómo usar url de imagen externa con react flux store?

insert image in react js

Question

Estoy accediendo a los datos del servidor con react flux utils y almacené los datos en flux store. Estos datos contienen el contenido del encabezado, el contenido de la descripción y la URL externa de la imagen (como, http://www.google.com/sample.jpg ). He almacenado localmente todos los datos con react flux store. Cuando vuelvo a visitar la página que ya fue visitada, las imágenes de la página se vuelven a cargar. No debería suceder. Porque esas imágenes ya están cargadas. ¿Cómo arreglar este problema?

Estructura de datos,

[
{
''title'':''title 1'',
''content'':''Some copy'',
''image'':''http://www.google.com/sample.jpg''
},
{
''title'':''title 2'',
''content'':''Some copy'',
''image'':''http://www.google.com/sample2.jpg''
}
]

Api

var Actions = require(''../actions/Actions'');
module.exports = {
getProductData: function() {
var data = JSON.parse(localStorage.getItem(''items''));
Actions.receiveProduct(data);
}
}

Transportista

var Dispatcher = require(''flux'').Dispatcher;
// Create dispatcher instance
var AppDispatcher = new Dispatcher();
// Convenience method to handle dispatch requests
AppDispatcher.handleAction = function(action) {
this.dispatch({
source: ''VIEW_ACTION'',
action: action
});
}
module.exports = AppDispatcher;

Constante

var keyMirror = require(''react/lib/keyMirror'');
// Define action constants
module.exports = keyMirror({
RECEIVE_DATA: null // Loads our mock data
});

Comportamiento

var AppDispatcher = require(''../dispatcher/AppDispatcher'');
var Constants = require(''../constants/Constants'');
// Define actions object
var MyActions = {
// Receive inital product data
receiveData: function(data) {
AppDispatcher.handleAction({
actionType: Constants.RECEIVE_DATA,
data: data
})
}
};
module.exports = MyActions;

Almacenar

var AppDispatcher = require(''../dispatcher/AppDispatcher'');
var EventEmitter = require(''events'').EventEmitter;
var Constants = require(''../constants/Constants'');
var _ = require(''underscore'');
// Define initial data points
var _product = {};
// Method to load product data from mock API
function loadData(data) {
_product = data;
}
// Extend ProductStore with EventEmitter to add eventing capabilities
var ProductStore = _.extend({}, EventEmitter.prototype, {
// Return Product data
getProduct: function() {
return _product;
},
// Emit Change event
emitChange: function() {
this.emit(''change'');
},
// Add change listener
addChangeListener: function(callback) {
this.on(''change'', callback);
},
// Remove change listener
removeChangeListener: function(callback) {
this.removeListener(''change'', callback);
}
});
// Register callback with AppDispatcher
AppDispatcher.register(function(payload) {
var action = payload.action;
var text;
switch(action.actionType) {
// Respond to RECEIVE_DATA action
case Constants.RECEIVE_DATA:
loadData(action.data);
break;
default:
return true;
}
// If action was responded to, emit change event
ProductStore.emitChange();
return true;
});
module.exports = ProductStore;