在不同组件之间实现数据共享的常见方式是使用状态管理库，例如React中的Redux或MobX，或者Vue中的Vuex。以下是使用Redux和React的代码示例来解决“不同组件之间的数据共享服务不起作用”的问题。

首先，我们需要安装redux和react-redux库：

npm install redux react-redux

然后，创建一个Redux store来保存共享的数据：

// store.js
import { createStore } from 'redux';

// 定义初始状态
const initialState = {
  data: null
};

// 定义reducer函数
const reducer = (state = initialState, action) => {
  switch (action.type) {
    case 'SET_DATA':
      return { ...state, data: action.payload };
    default:
      return state;
  }
};

// 创建store
const store = createStore(reducer);

export default store;

接下来，我们可以在需要共享数据的组件中使用connect函数将组件连接到Redux store，并使用mapStateToProps将共享的数据映射到组件的props中：

// MyComponent.js
import React from 'react';
import { connect } from 'react-redux';

const MyComponent = ({ data, setData }) => {
  const handleClick = () => {
    setData('Hello, world!');
  };

  return (
    

      Set Data
      
{data}
    
  );
};

const mapStateToProps = (state) => ({
  data: state.data
});

const mapDispatchToProps = (dispatch) => ({
  setData: (data) => dispatch({ type: 'SET_DATA', payload: data })
});

export default connect(mapStateToProps, mapDispatchToProps)(MyComponent);

在上面的代码中，当点击按钮时，会调用setData函数来更新共享的数据。

最后，在应用的根组件中，将Redux store提供给整个应用：

// App.js
import React from 'react';
import { Provider } from 'react-redux';
import store from './store';
import MyComponent from './MyComponent';

const App = () => {
  return (
    
      
    
  );
};

export default App;

通过上述代码示例，我们在不同组件之间使用Redux来实现数据共享服务，通过Redux store来存储和更新共享的数据。在需要共享数据的组件中，使用connect函数将组件连接到Redux store，并通过mapStateToProps和mapDispatchToProps将共享的数据映射到组件的props中，并提供更新数据的方法。