Question

我有一个现有的laravel刀片模板，正在使用刀片模板中的Vue组件对其进行重写。
例如，刀片模板中的一条现有行是：

<button class="btn-remove" onclick="removeItem('{{ $item->id }}', this);"></button>

这引用了一个名为removeItem的php函数。
有没有办法在新的Vue组件中调用php函数，还是必须将php函数重做为javascript？

Answer 1

我相信您的意思是模板引用了from web3 import Web3, HTTPProvider from solc import compile_source from web3.contract import ConciseContract from random import randint import time import json #actual web3 provider (for more info: http://web3py.readthedocs.io/en/stable/providers.html) w3 = Web3(HTTPProvider('http://127.0.0.1:8545')) #abi can be generated form the command line with solc or online with Remix IDE abi = json.loads('''[ { "constant": false, "inputs": [], "name": "getSensorData", "outputs": [ { "name": "", "type": "int256" } ], "payable": false, "stateMutability": "nonpayable", "type": "function" }, { "constant": false, "inputs": [ { "name": "_sensorData", "type": "int256" } ], "name": "setSensorData", "outputs": [], "payable": false, "stateMutability": "nonpayable", "type": "function" }, { "inputs": [ { "name": "_sensorData", "type": "int256" } ], "payable": false, "stateMutability": "nonpayable", "type": "constructor" } ] ''') address = Web3.toChecksumAddress("0xc9ab3c7431dd3298b26546ffc2526d9b45469cf0") StoreIntegerValue = w3.eth.contract( address, abi=abi, ContractFactoryClass=ConciseContract) #Replace with real account address for raspi raspi = 0x26b3bff595e86d4c318f34f2e92195f44eaa327b #Example function to submit data to the block chain def submitSensorData(data): #note that data must be an integer, StoreIntegerValue.setSensorData(int(data), transact={'from': raspi}) def stopwatch(seconds): TempCount=0 Count=0 start=time.time() time.clock() elapsed=0 while elapsed < seconds: elapsed = time.time()-start Temp= randint(15,25) print("temp values: ", Temp) if(Temp>20): TempCount=TempCount + 1 Count = TempCount TempCount = 0 time.sleep(2) return Count #, int(time.time()) k= stopwatch(30) if(k>3): submitSensorData(k)函数，该函数在随刀片一起运行的JS脚本中的某个位置定义。

如果要将整个刀片迁移到VueJs实例，则需要将Vue组件使用的方法移到其ViewModel定义中。

您还需要将来自removeItem的任何数据作为PHP进行传递或从API提取，以便该组件在呈现后可以访问它

在您的示例中，组件看起来像这样（使用道具）。

prop

在刀片文件中，您将替换为：

Vue.component('MyComponent', {
    template:  `
        <div>
            <button class="btn-remove" @click="removeItem"></button>
        </div>
    `,
    props: {
        itemId: String
    },
    methods: {
        removeItem() {
            // Handle click event
            this.$emit('remove', this.itemId); // for example
        }
    }
})

Vue将用您组件中指定的模板替换上面的模板，并且PHP“绑定”将作为文本传递到HTML中。

用Vue代替Laravel刀片

1 个答案: